<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../plugins/layui/css/layui.css?v=${.Config.basic.version}" media="all">
    <link rel="stylesheet" href="../plugins/layui/css/style.css?v=${.Config.basic.version}" media="all">

    <link rel="stylesheet" href="../layuiadmin/style/admin.css?v=${.Config.basic.version}" media="all">
    <link rel="stylesheet" href="../plugins/zTree/css/metroStyle/metroStyle.css?v=${.Config.basic.version}">
    <link rel="stylesheet" href="../plugins/zTree/css/metroStyle/ext.css?v=${.Config.basic.version}">
    <link rel="stylesheet" href="../css/atlantis.css?v=${.Config.basic.version}">
    <link rel="stylesheet" href="../dashboard/css/jquery.liMarquee.css?v=${.Config.basic.version}">
    <link rel="stylesheet" href="//at.alicdn.com/t/c/font_3564966_a6tt4yhnzge.css?v=${.Config.basic.version}" media="all">
    <link rel="stylesheet" href="../plugins/toastr/toastr.min.css?v=${.Config.basic.version}">

    <style>
        .header-panel {
            display: flex;
            width: 15%;
            height: 5.5vh;
            flex-direction: column;
            align-items: flex-end;
            justify-content: center;
            z-index: 11;
            position: absolute;
            left: 85%;
        }

        .layui-tab {
            margin: 0;
            text-align: left !important;
        }

        .header-panel .layui-input,
        .layui-select,
        .layui-textarea {
            height: 34px;
            line-height: 34px;
            border-width: 1px;
            border-style: solid;
            background-color: #fff;
            /* color: #8f97b3; */
            border-radius: 0;
            border: 0px solid #6c7492;
            /*text-align: right;*/
            text-align: center;
            font-size: 18px;
            border-bottom: 3px solid #3c7cff;
        }

        .header-panel .layui-form-select dl dd {
            cursor: pointer;
            text-align: center;
        }

        .xcard-header .layui-input,
        .layui-select,
        .layui-textarea {
            height: 20px;
            line-height: 20px;
            border-width: 1px;
            border-style: solid;
            /*background-color: #3d4b9f;*/
            background-color:transparent;
            /* color: #ffffff; */
            border-radius: 5px;
            border: 0px solid #6c7492;
            /*text-align: right;*/
            text-align: right;
            font-size: 11px;
        }

        .xcard-header .layui-form-select dl dd {
            cursor: pointer;
            text-align: center;
        }

        .content {
            padding: 2px;
            position: absolute;
            top: 1px;
            bottom: 0;
            left: 0;
            right: 0;
            right: 0;
            z-index: 10;
        }

        .top-content {
            /*display: flex;*/
            width: 100%;
            /*height: 20%;*/
        }

        .bottom-content {
            display: flex;
            width: 100%;
            /*height: 80%;*/
            height: calc(100% - 120px);
        }

        .left-content {
            display: flex;
            width: 25%;
            height: 100%;
        }

        .right-content {
            display: flex;
            width: 75%;
            height: 100%;
        }

        .panel-container {
            display: flex;
            flex: 1 1 0;
            flex-grow: 1;
            flex-shrink: 1;
            flex-basis: 0px;
            flex-direction: column;
            height: 100%;
            position: relative;
            width: 100%;
        }

        .mode-panel {
            height: 50%;
            border-radius: 10px;
            margin-left: 10px;
        }

        .feed-chart-panel {
            height: 50%;
            margin-left: 10px;
            margin-right: 10px;
        }

        .house-panel {
            height: 50%;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bg-panel {
            background-color: #3c7cff;
            border: 1px solid #ccccdc12;
            border-radius: 3px;
            box-shadow: none;
            box-shadow: 0 0 .18rem rgba(19, 158, 255, .4) inset;
            position: relative;
            border-radius: 10px;
        }

        .panel-header {
            height: 2rem;
            margin-bottom: 0.1rem;
            position: relative;
        }

        .panel-header {
            height: 2rem;
            margin-bottom: 0.1rem;
            position: relative;
        }

        .panel-title {
            font-size: 1rem;
            color: #8f97b3;
            line-height: 2rem;
            font-weight: bold;
            position: relative;
            z-index: 20;
            margin-left: 1rem;
        }

        .panel-content {
            height: calc(100% - 2rem);
        }



        /* .house:hover {
            background-color: #0e1013;
            background-image: linear-gradient(45deg, #3c7cff, #3c7cff) !important;
        } */

        .house-content {
            height: 90%;
        }


        .panel-rela {
            position: relative;
            z-index: 20;
            width: 100%;
            height: 100%;
        }

        .p15 {
            padding: 0.15rem;
        }

        .layui-elem-quote {
            margin-bottom: 10px;
            /*margin-top: 10px;*/
            padding: 10px;
            line-height: 5px;
            border-left: 2px solid #00c7d9;
            border-radius: 0 2px 2px 0;
            background-color: transparent;
            color: #eeeeee;
            font-size: 0.9rem;
        }

        .house-img {
            height: 50%;
            overflow: hidden;
            cursor: pointer;
            /*padding: 10px;*/
            /*margin: 10px;*/
            /*opacity: 0.5;*/
            background: url("../img/house.png") no-repeat scroll center center;
            background-position-x: center;
            background-position-y: center;
            background-size: auto;
            background-position-x: center;
            background-position-y: center;
            background-size: auto;
            display: block;
            background-position: 50% 0%;
            background-size: 50%;
            /*top: -20%;*/
            position: relative;
        }

        .drop {
            /*width: 100%;*/
            height: auto;
            /*background: rgba(31,48,102,.6);*/
            position: relative;
            /*padding-left: 10px;*/
            /*padding-right: 10px;*/
            padding: 10px;
            /*top: 35%;*/
            /*left: 0;*/
            /*margin-left: -65px;*/
        }

        .drop .tit {
            font-size: 0.9rem;
            color: #fff;
            text-align: center;
        }

        .drop .box {
            margin-top: 5px;
        }

        .drop p {
            font-size: 0.8rem;
            color: #a3bed9;
            line-height: 1rem;
        }

        .drop p em {
            float: right;
            font-style: normal;
        }

        .drop .ico {
            width: 9px;
            height: 9px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
            display: block;
            position: absolute;
        }

        .drop .ico_1 {
            background-image: url("../img/top_left.png");
            top: 0;
            left: 0;
        }

        .drop .ico_2 {
            background-image: url("../img/top_right.png");
            top: 0;
            right: 0;
        }

        .drop .ico_3 {
            background-image: url("../img/bottom_left.png");
            bottom: 0;
            left: 0;
        }

        .drop .ico_4 {
            background-image: url("../img/bottom_right.png");
            bottom: 0;
            right: 0;
        }

        [v-cloak] {
            display: none;
        }

        .panel-under-title {
            height: calc(100% - 20px);
        }

        .gdhead {
            display: flex;
            justify-content: space-between;
            line-height: 30px;
        }

        .gdhead span {
            width: 100%;
            text-align: center;
            font-size: 0.9rem;
        }

        .smjl li {
            display: flex;
            padding: 5px 0;
            border: 1px solid #182557
        }

        .smjl li span {
            width: 100%;
            text-align: center;
            font-size: .7rem;
            opacity: .8;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .tabnav>li {
            height: 0;
            overflow: hidden;
        }

        .full-height {
            height: 100% !important;
        }

        /* .layui-select-title{
            border-bottom: 2px solid #3c7cff;
            box-shadow: 1px 1px 0px 0px #3c7cff;
        } */
    </style>
</head>

<body>

    <style>
        .xcard {
            border-radius: 2px;
            background-color: #fff;
            box-shadow: 2px 12px 10px 3px #F1F1F1;
            border: 0;
        }

        .xcard:hover {
            box-shadow: 0 6px 16px 0 rgba(0,39,114,.08);
            border-color: transparent;
        }

        .xcard-header {
            padding: 10px 10px 5px 20px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .xcard-header::before {
            content: "";
            width: 4px;
            height: 18px;
            background: #3c7cff;
            box-shadow: 0 0 5px #ccc;
            border-radius: 3px;
            margin-right: 5px;
            margin-top: -2px;
        }

        .xcard-header .sebtn a {
            /* opacity: 0.8; */
            display: inline-block;
            padding: 0.5em;
            color: #333;
            font-size: .8em;
            border: 1px solid #3c7cff;
            line-height: 1em;
            font-weight: normal;
        }

        .xcard-header .sebtn a.active {
            /* opacity: 0.8; */
            color: #fff;
            background-color: #3c7cff;
        }

        .xcard-header .sebtn a:hover {
            opacity: 0.7;
            color: #fff;
            background-color: #3c7cff;
        }

        .alltitle .fr a {
            color: #fff;
        }

        .xcard-body {
            padding: 0px 10px 0px 20px;
            overflow: hidden;
            height: calc(100% - 40px);
        }

        .xcard-title {
            font-size: 0.9em;
            font-weight: 600;
            /* display: flex; */
            width: 100%;
        }

        .xitem {
            display: flex;
            align-items: center;
            /* padding: 0.4em 0px; */
            cursor: pointer;
            margin: 0.2em 0.2em;
            /* border: 1px solid #3c7cff; */
            /* box-shadow: 0 0 2px #B6A792; */
            background-color: #f4f4f4;
        }

        .xitem-icon {
            flex-shrink: 0;
            width: 2.5em;
            height: 2.5em;
            font-size: 1.4em;
            display: flex;
            align-items: center;
            justify-content: center;
            line-height: 0;
            /* border-radius: 100%; */
            cursor: pointer;
            /* background-color: #3c7cff; */
            box-shadow: 0 0 2px #B6A792;
            color: #fff;
            background: linear-gradient(135deg, #3c7cff 60%, #67d3ce 100%);
        }

        .xitem-content {
            flex: 1;
            margin-left: 10px;
            margin-top: 5px;
        }
        .layui-text-sm {
            font-size: 0.8rem !important;
        }

        .xitem-unit {
            padding-left: 0.5em;
            /* line-height: 1em; */
        }

        .block {
            display: block;
        }

        .text-value {
            font-family: "Oswald", sans-serif;
        }

        .content-div {
            /* display: flex; */
            /* flex-direction: row; */
            overflow: hidden;
            height: 100%;
        }

        .xhouse {
            margin: 5px;
            padding: 5px;
            border-radius: 2px;
            background-color: #f4f4f4;
            height: 60px;
            cursor: pointer;
            box-shadow: 1px 1px 5px 1px #B4B4B4;
        }

        .xhouse:hover {
            background-color: #eee;
        }

        .xhouse-icon {
            width: 40%;
            height: 60px;
            background: url("../img/house.png") no-repeat scroll center center;
            background-size: auto;
            /* background-position: 50% 0%; */
            background-size: 60%;
        }
        .xhouse-gw-online-icon{
            width: 40%;
            height: 60px;
            background: url("../img/gw_online.png") no-repeat scroll center center;
            background-size: auto;
            /* background-position: 50% 0%; */
            background-size: 40%;
        }
        .xhouse-gw-offline-icon{
            width: 40%;
            height: 60px;
            background: url("../img/gw_offline.png") no-repeat scroll center center;
            background-size: auto;
            /* background-position: 50% 0%; */
            background-size: 40%;
            opacity: .5;
        }

        .xhouse-title {
            width: 60%;
            height: 60px;
            display: flex;
            justify-content: left;
            align-items: center;
            overflow: hidden;
            white-space: nowrap;
        }

        .xhouse-title p {
            text-overflow: ellipsis;
            overflow: hidden;
            font-size: 0.8em;
            color: #333;
            font-weight: bold;
        }

        .xhouse-item {
            height: 50px;
            border-left: 2px solid #656d83;
            padding: 2px 15px 2px 15px;
            margin: 2px;
            overflow: hidden;
            white-space: nowrap;
        }

        .xhouse-item .title {
            font-size: 0.7em;
            line-height: 1em;
            color: #333;
            font-weight: bold;
        }

        .xhouse-item .value {
            font-size: 1.2em;
            color: #333;
            line-height: 2em;
        }

        .xhouse-item .value-lg {
            font-size: 1.2em;
            color: #333;
            line-height: 2.5em;
        }

        .layui-bg-green-light{
            background-color: #5FB878;
        }
        .xsum-box{
            background-color: #e0e0e0;
            margin: 1px;
            min-height: 80px;
            cursor: pointer;
            transition: all 0.3s;
            border-bottom: 4px solid #e0e0e0;
        }
        .xsum-box :hover{
            opacity: 0.7;
            /* background-color: #192341; */
            /* box-shadow:0 15px 30px rgba(0,0,0,.3); */
                /* 注释：box-shadow 前面三个参数控制阴影范围，最后一个是阴影颜色浓度； */
            /* -webkit-transform:translate3d(0,-5px,0);  */
                /* 注释：-webkit-transform为上浮控制，上浮程度填写在（）内的第二个参数【值得注意的是上浮为负数，下沉为正】； */
            /* transition: 1s; */
                /* 注释：transition为延迟（也就是变大变慢些，上浮慢些），延长整个过程时间填写在 */
            /* ​transform:scale(1.5)； */
            /* 注释：transform为放大倍数，倍数在（）内填写； */
        }

        .xsum .active{
            border-bottom: 4px solid #3c7cff;
            background-color: #e2e2e2;        
        }
        .xsum-box-left .icon-box{
            min-height: 70px;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 5px;
        }
        
        .icon-box .icon{
            font-size: 3em !important;
        }
        .xsum-box-right {
            height: 80px;
            padding: 0.5em;
            border-left: 0px solid #304178;
        }
        .xsum-box-right .title{
            margin: 0.1em;
            font-size: 0.8em;
            text-align: center;
        }
        .xsum-box-right .value{
            margin: 0.1em;
            font-size: 2em;
            text-align: center;
            color: #333;
        }

        .alarm-panel{
            background-color: transparent !important;
        }

        .line-through{
            text-decoration: line-through
        }
        .no-data{
            height: 100%;
            width: 100%;
            background: url("../img/nodata3.png") no-repeat scroll center center;
            background-position: 50% 40%;
            background-size: 10%;
            opacity: .2;
        }
    </style>

    <div class="header-panel">
        <form class="layui-form" lay-filter="form_select">
            <select name="farm" lay-filter="farm" lay-verify="required" lay-search="" style="width: 100%;">
                <option value=""></option>
            </select>
        </form>
    </div>

    <div class="content ">
        <div class=" layui-tab layui-tab-brief" lay-filter="main-tab" id="tab">
            <ul class="layui-tab-title">
                <li class="layui-this" lay-id="basic"><i class="layui-icon layui-icon-chart-screen "></i> 场区概览 </li>
                <li lay-id="house"><i class="iconfont icon-fangwu  "></i> 单元列表 </li>
                <li lay-id="alarm"><i class="layui-icon layui-icon-notice "></i> 告警通知 <span id="alarm-badge" class="layui-badge" style="display: none;top: 0px;">0</span></li>
                <li lay-id="gw"><i class="iconfont icon-yingjian "></i> 智能网关 </li>
            </ul>
            <div class="layui-tab-content" style="background-color: #fff;">
                <div class="layui-tab-item layui-show">
                    <div class="content-div">
                        <div style="width: 100%;height: 220px;display: flex;">
                            <div style="height: 100%;width: 100%;">
                                <div class="xcard farm" style="height: 100%;" v-cloak>
                                    <div class="xcard-header bg-transparent">
                                        <div class="xcard-title">
                                            <span>场区概况</span>
                                            <p class="fr layui-text-mute layui-text-xs"><i class="iconfont icon-xiazai19 layui-text-xs"></i>{{province}} {{city}} {{address}} 
                                                <!-- <i class="layui-icon layui-icon-user layui-text-xs"></i>{{person}} {{phone}}  -->
                                            </p>
                                        </div>
                                    </div>
                                    <div class="xcard-body">
                                        <div></div>
                                        <div class="layui-row">
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">总存栏</span>
                                                        <span
                                                            class="layui-text-md block text-value">{{pig_num_total}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-xialiaoqi "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">今日下料</span>
                                                        <span class="layui-text-md block">
                                                            {{today_feed}}<span class="layui-text-xs layui-text-mute"> 吨</span>
                                                            <span v-if="today_feed_diff<=0" class="layui-text-xs layui-text-green-light">⬇{{Math.abs(today_feed_diff)}}%</span>
                                                            <span v-if="today_feed_diff>0" class="layui-text-xs layui-text-orange">⬆{{Math.abs(today_feed_diff)}}%</span>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-xialiaoqi"></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">昨日下料</span>
                                                        <span class="layui-text-md block">{{yestoday_feed}}<span class="layui-text-xs layui-text-mute"> 吨</span>
                                                            
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-shui "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">今日下水</span>
                                                        <span class="layui-text-md block">{{today_water}}<span class="layui-text-xs layui-text-mute"> 吨</span>
                                                            <span v-if="today_water_diff<=0" class="layui-text-xs layui-text-green-light">⬇{{Math.abs(today_water_diff)}}%</span>
                                                            <span v-if="today_water_diff>0" class="layui-text-xs layui-text-orange">⬆{{Math.abs(today_water_diff)}}%</span>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-shui "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">昨日下水</span>
                                                        <span class="layui-text-md block">{{yestoday_water}}<span class="layui-text-xs layui-text-mute"> 吨</span></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-shebeizhuangtai layui-text-white"></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">设备总数</span>
                                                        <span class="layui-text-md  block">{{online_num+offline_num}}<span class="layui-text-xs layui-text-mute"> 台</span></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-shebeizhuangtai layui-text-white"></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">在线设备</span>
                                                        <span v-bind:class="{'layui-text-black': online_num==0,'layui-text-green-light':online_num>0}" class="layui-text-md  block">{{online_num}}<span class="layui-text-xs layui-text-mute"> 台</span></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-shebeizhuangtai layui-text-orange"></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">离线设备</span>
                                                        <span v-bind:class="{'layui-text-white': isNaN(offline_num),'layui-text-orange':offline_num>0}" class="layui-text-md block">{{offline_num}}<span class="layui-text-xs layui-text-mute"> 台</span></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont  icon-tingyong "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">空栏</span>
                                                        <span class="layui-text-md block">{{num_stop}}<span class="layui-text-xs layui-text-mute"> 个</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem" @click="gotoAlarm();">
                                                    <div class="xitem-icon ">
                                                        <i class="layui-icon layui-icon-notice layui-text-orange"></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">告警设备</span>
                                                        <span v-bind:class="{'layui-text-white': isNaN(alarm_device_num),'layui-text-orange':alarm_device_num>0}" class="layui-text-md block">{{alarm_device_num}}<span class="layui-text-xs layui-text-mute"> 台</span></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">仔猪</span>
                                                        <span class="layui-text-md block">{{son_total}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">妊娠猪</span>
                                                        <span class="layui-text-md block">{{pig_num1}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">哺乳母猪</span>
                                                        <span class="layui-text-md block">{{pig_num2}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">保育猪</span>
                                                        <span class="layui-text-md block">{{pig_num3}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">育肥猪</span>
                                                        <span class="layui-text-md block">{{pig_num4}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-pig "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">公猪</span>
                                                        <span class="layui-text-md block">{{pig_num5||pig_num6}}<span class="layui-text-xs layui-text-mute"> 头</span></span>
                                                    </div>
                                                </div>
                                            </div>
                                            

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-fangwu "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">单元</span>
                                                        <span class="layui-text-md block">{{house_num}}<span class="layui-text-xs layui-text-mute"> 间</span></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="layui-col-lg2 layui-col-md2">
                                                <div class="xitem" @click="gotoGw();">
                                                    <div class="xitem-icon ">
                                                        <i class="iconfont icon-yingjian "></i>
                                                    </div>
                                                    <div class="xitem-content">
                                                        <span class="layui-text-sm layui-text-mute">智能网关</span>
                                                        <span v-bind:class="{'layui-text-green-light': gw_all_online>0,'layui-text-orange':gw_all_online==0}" class="layui-text-md  block">{{gw_alive_num}}/{{gw_num}} <span class="layui-text-xs layui-text-mute"> 在线</span></span>
                                                    </div>
                                                </div>
                                            </div>


                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- <div style="height: 100%;width: 25%;">
                                <div class="xcard" style="height: 100%;margin-left: 5px;">
                                    <div class="xcard-header bg-transparent">
                                        <div class="xcard-title">
                                            <span>提醒事项</span>

                                        </div>
                                    </div>
                                    <div class="xcard-body" v-if="list.length==0">
                                        <div class="no-data" style="background-size: 30%;"></div>
                                    </div>
                                </div>
                            </div> -->
                        </div>

                        <div style="width: 100%;height: calc(100% - 220px);margin-top: 5px;">
                            <div style="width: 100%;height: 50%;display: flex;">
                                <div style="width: 50%;height: 100%;">
                                    <div class="xcard" style="height: 100%;">
                                        <div class="xcard-header bg-transparent">
                                            <div class="xcard-title">
                                                <span>场区总采食量</span>
                                                <div class="fr sebtn DaySumFeedType">
                                                    <a href="#" class="active" data-type="DaySumFeedTotal">全部</a>
                                                    <a href="#" data-type="DaySumFeedAuto" class="">智能</a>
                                                    <a href="#" data-type="DaySumFeedMan" class="">手动</a>
                                                    <!-- <a href="#" data-type="Export" class="">导出</a> -->
                                                </div>
                                            </div>
                                        </div>
                                        <div class="xcard-body ">
                                            <div style="height:100%;width:100%;" id="chartDaySumFeed"></div>
                                        </div>
                                    </div>
                                </div>
                                <div style="width: 50%;height: 100%;">
                                    <div class="xcard" style="height: 100%;margin-left: 5px;">
                                        <div class="xcard-header bg-transparent">
                                            <div class="xcard-title">
                                                <span>单元头均采食量</span>
                                                <div class="fr">
                                                    <form class="layui-form" lay-filter="form_select">
                                                        <select name="house" lay-filter="house" lay-verify="required" lay-search="" style="width: 100%;">
                                                            <option value=""></option>
                                                        </select>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="xcard-body ">
                                            <div style="height:100%;width:100%;" id="chartDayAvgFeed"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div style="width: 100%;height: 50%;margin-top:5px;display: flex;">
                                <div style="width: 75%;height: 100%;">
                                    <div class="xcard house_sort" style="height: 100%;" v-cloak>
                                        <div class="xcard-header bg-transparent">
                                            <div class="xcard-title">
                                                <span>单元饲喂概况</span>
                                                <div class="fr sebtn">
                                                    <span class="layui-badge-rim fr hand " style="margin: 1px;
                                                    background-color: #fff;
                                                    border: 1px solid #3c7cff;"><i class="layui-icon layui-icon-date layui-text-sm"></i> <span id="id-date" lay-key=""></span></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="xcard-body ">
                                            <div style="height:100%;width:100%;" id="chartHouseSort"></div>
                                        </div>
                                    </div>
                                </div>
                                <div style="width: 25%;height: 100%;">
                                    

                                    <div class="xcard" style="height: 100%;margin-left: 5px;">
                                        <div class="xcard-header bg-transparent">
                                            <div class="xcard-title">
                                                <span>全场采食量达标统计</span>
                                                <div class="fr sebtn">
                                                    <span class="layui-badge-rim fr hand " style="margin: 1px;
                                                    background-color: #fff;
                                                    border: 1px solid #3c7cff;"><i class="layui-icon layui-icon-date layui-text-sm"></i> <span id="id-date1" lay-key=""></span></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="xcard-body ">
                                            <div style="height:100%;width:100%;" id="chartAchievementRate"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="layui-tab-item ">
                    <div class="content-div">
                        <div class="xcard house" style="height: 100%;">
                            <div class="xcard-header bg-transparent">
                                <div class="xcard-title">
                                    <span>单元概况(总数:<span :class="{'layui-text-green-light':list.length>0,'layui-text-mute':list.length==0}">{{list.length}}</span>)</span>
                                    <div class="fr sebtn HouseType">
                                        <a href="#" class="active" data-type="">全部</a>
                                        <a href="#" data-type="1" class="">妊娠舍</a>
                                        <a href="#" data-type="2" class="">哺乳舍</a>
                                        <a href="#" data-type="3" class="">保育舍</a>
                                        <a href="#" data-type="4" class="">育肥舍</a>
                                        <a href="#" data-type="5" class="">公猪舍</a>
                                    </div>
                                </div>
                            </div>
                            <div class="xcard-body" v-if="list.length>0">
                                <template v-for="(item,idx) in list">
                                    <div class="xhouse " @click="gotoHouse(item,idx);">
                                        <div class="layui-row">
                                            <div class="layui-col-xs2 " style="display: flex;">
                                                <div class="xhouse-icon">
                                                </div>
                                                <div class="xhouse-title">
                                                    <p>{{item.housename}}</p>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs2">
                                                <div class="xhouse-item">
                                                    <p class="title">饲喂器在线</p>
                                                    <p class="value">{{item.online_num}}/{{item.device_num}}<span
                                                        class="layui-text-sm fr" :class="item.online_per_color">
                                                        {{item.online_per}}%</span></p>
                                                    <div class="layui-progress">
                                                        <div class="layui-progress-bar " :class="item.online_per_bar_color"
                                                            v-bind:lay-percent="item.online_per_str"></div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs3" v-if="item.house_type==1 || item.house_type==2 || item.house_type==5">
                                                <div class="xhouse-item" >
                                                    <p class="title">今日下料量/计划量</p>
                                                    <p class="value">{{item.today_feed}}/{{item.max_feed}} kg<span
                                                            class="layui-text-sm fr" :class="item.feed_per_color">
                                                            {{item.feed_per}}%</span></p>
                                                    <div class="layui-progress">
                                                        <div class="layui-progress-bar " :class="item.feed_per_bar_color"
                                                             v-bind:lay-percent="item.feed_per_str"></div>
                                                    </div>
                                                </div>
                                                
                                            </div>
                                            <div class="layui-col-xs2" v-if="item.house_type==3 || item.house_type==4">
                                                <div class="xhouse-item" >
                                                    <p class="title">今日下料量</p>
                                                    <p class="value">{{item.today_feed}} kg</p>
                                                </div>
                                            </div>
                                            
                                            <div class="layui-col-xs2">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">昨日下料</p>
                                                    <p class="value-lg text-center">{{item.yestoday_feed}} <span class="layui-text-sm"> kg</span></p>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs1">
                                                <div class="xhouse-item">
                                                    <p v-if="item.house_type==2 || item.house_type==1 " class="title text-center">母猪</p>
                                                    <p v-if="item.house_type!=2 && item.house_type!=1" class="title text-center">猪只</p>
                                                    <p v-if="item.house_type!=2 && item.house_type!=1" class="value-lg text-center">{{item.pig_num_total}}</p>
                                                    <p v-if="item.house_type==2 || item.house_type==1" class="value-lg text-center">{{item.pig_num_total}}</p>
                                                </div>
                                            </div>
                                            <div v-if="item.house_type==2 || item.house_type==1" class="layui-col-xs1">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">仔猪</p>
                                                    <p class="value-lg text-center">{{item.son_total}}</p>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs1">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">告警</p>
                                                    <p v-if="item.alarm_device_num>0" class="value-lg layui-text-red text-center">{{item.alarm_device_num}}</p>
                                                    <p v-if="item.alarm_device_num==0" class="value-lg layui-text-mute text-center">-</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </template>
                            </div>
                            <div class="xcard-body" v-if="list.length==0">
                                <div class="no-data"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-tab-item ">
                    <div class="content-div ">
                        <div style="width: 100%;" class="AlarmType">
                            <div class="layui-row xsum alarm"  v-cloak>

                                <div class="layui-col-xs2">
                                    <div class="xsum-box AlarmTypeItem active" data-type="alarm">
                                        <div class="xsum-box-body layui-row">
                                            <di class="layui-col-xs5 xsum-box-left">
                                                <div class="icon-box">
                                                    <i class="icon layui-icon layui-icon-notice layui-text-red"></i>
                                                </div>
                                            </di>
                                            <di class="layui-col-xs7 xsum-box-right">
                                                <p class="title">告警中</p>
                                                <p class="value layui-text-red">{{alarm_num}}</p>
                                            </di>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="layui-col-xs2">
                                    <div class="xsum-box AlarmTypeItem " data-type="notice">
                                        <div class="xsum-box-body layui-row">
                                            <di class="layui-col-xs5 xsum-box-left">
                                                <div class="icon-box">
                                                    <i class="icon layui-icon layui-icon-chat layui-text-orange"></i>
                                                </div>
                                            </di>
                                            <di class="layui-col-xs7 xsum-box-right">
                                                <p class="title">通知</p>
                                                <p class="value layui-text-orange">{{notice_num}}</p>
                                            </di>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="layui-col-xs2">
                                    <div class="xsum-box AlarmTypeItem" data-type="cancel">
                                        <div class="xsum-box-body layui-row">
                                            <di class="layui-col-xs5 xsum-box-left">
                                                <div class="icon-box">
                                                    <i class="icon layui-icon layui-icon-ok-circle layui-text-black"></i>
                                                </div>
                                            </di>
                                            <di class="layui-col-xs7 xsum-box-right">
                                                <p class="title">已取消</p>
                                                <p class="value layui-text-mute">{{cancel_num}}</p>
                                            </di>
                                        </div>
                                    </div>
                                </div>

                                <!-- <div class="layui-col-xs3">
                                    <div class="xsum-box AlarmTypeItem " data-type="all">
                                        <div class="xsum-box-body layui-row">
                                            <di class="layui-col-xs5 xsum-box-left">
                                                <div class="icon-box">
                                                    <i class="icon layui-icon layui-icon-dialogue layui-text-black"></i>
                                                </div>
                                            </di>
                                            <di class="layui-col-xs7 xsum-box-right">
                                                <p class="title">全部</p>
                                                <p class="value">{{total_num}}</p>
                                            </di>
                                        </div>
                                    </div>
                                </div> -->

                            </div>
                        </div>
                        <div style="width: 100%;height: calc(100% - 80px);margin: 5px;" >
                            <div class=" alarm-panel " style="height: 100%;" >
                                <div class="xcard-header bg-transparent" style="padding: 0;">
                                    <div class="xcard-title">
                                        <span>全部</span>
                                        <div class="fr sebtn AlarmRange">
                                            <a href="#" class="active" data-type="all">全部</a>
                                            <a href="#" data-type="today" class="">今日</a>
                                            <a href="#" data-type="week" class="">本周</a>
                                            <a href="#" data-type="month" class="">本月</a>
                                        </div>
                                    </div>
                                </div>
                                <div class="xcard-body" style="padding: 0px 5px 0px 0px">
                                    <table class="layui-hide" id="alarm_table" lay-filter="alarm_table"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                </div>
                <div class="layui-tab-item ">
                    <div class="content-div">
                        <div class="xcard gw" style="height: 100%;">
                            <div class="xcard-header bg-transparent">
                                <div class="xcard-title">
                                    <span>总数:<span :class="{'layui-text-white':list.length>online_num,'layui-text-white':list.length==online_num}">{{list.length}}</span> 在线:<span class="layui-text-green-light">{{online_num}}</span> 离线:<span class="layui-text-mute">{{offline_num}}</span></span>
                                    <div class="fr sebtn GwType">
                                        <a href="#" class="active" data-type="">全部</a>
                                        <a href="#" data-type="1" class="">在线</a>
                                        <a href="#" data-type="0" class="">离线</a>
                                    </div>
                                </div>
                            </div>
                            <div class="xcard-body" v-if="list.length>0">
                                <template v-for="(item,idx) in list">
                                    <div class="xhouse " @click="onDetailGw(item,idx);">
                                        <div class="layui-row">
                                            <div class="layui-col-xs2 " style="display: flex;">
                                                <div v-if="item.alive" class="xhouse-gw-online-icon">

                                                </div>
                                                <div v-else class="xhouse-gw-offline-icon">

                                                </div>
                                                <div class="xhouse-title" >
                                                    <p style="font-size: 1em;" :class="{ 'layui-text-green':item.alive>0,'layui-text-mute':item.alive==0}">{{item.device_addr}} {{item.alive?'在线':'离线'}}</p>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs2">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">单元</p>
                                                    <p class="value-lg text-center" :class="{ 'layui-text-green':item.alive>0,'layui-text-mute':item.alive==0}">{{item.housename}}</p>
                                                </div>
                                            </div>
                                            
                                            <div class="layui-col-xs2">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">IP</p>
                                                    <p class="value-lg text-center" :class="{ 'layui-text-green':item.alive>0,'layui-text-mute':item.alive==0}">{{item.device_ip}}</p>
                                                </div>
                                            </div>

                                            <div class="layui-col-xs3">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">版本号</p>
                                                    <p class="value-lg text-center" style="font-size: 1em;margin-top: 0.2em;" :class="{ 'layui-text-green':item.alive>0,'layui-text-mute':item.alive==0}">{{item.version}}</p>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs3">
                                                <div class="xhouse-item">
                                                    <p class="title text-center">最后心跳</p>
                                                    <p class="value-lg text-center" style="font-size: 1em;margin-top: 0.2em;" :class="{ 'layui-text-green':item.alive>0,'layui-text-mute':item.alive==0}">{{item.lasttime}}</p>
                                                </div>
                                            </div>
                                            
                                        </div>
                                    </div>
                                </template>
                            </div>
                            <div class="xcard-body" v-if="list.length==0">
                                <div class="no-data"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>


    </div>


    <style>
        .layui-input{
            font-size: 11px;
        }
        .layui-form-label-sm {
            float: left;
            display: block;
            padding: 7px 5px 7px 5px;
            width: 80px;
            font-weight: 400;
            line-height: 20px;
            text-align: center;
            font-size: 11px;
        }
    </style>
    <!-- <style>
        .layui-table-view .layui-table td, .layui-table-view .layui-table th {
            padding: 5px 0;
            border-top: 1px solid #404453;
            border-left: 1px solid #404453;
            border-bottom: 1px solid #404453;
            border-right: 1px solid #404453;
        }
    </style> -->

    <script src="../plugins/layui/layui.js"></script>
    <script src="../plugins/layui/xm-select-v1.2.4.js"></script>
    <script src="../plugins/jquery/jquery-3.6.0.js?v=${.Config.basic.version}"></script>
    <script src="../plugins/vue/vue.min.js"></script>
    <script src="../plugins/zTree/js/jquery.ztree.core.min.js?v=${.Config.basic.version}"></script>
    <script src="../plugins/zTree/js/jquery.ztree.excheck.js?v=${.Config.basic.version}"></script>
    <script src="../plugins/zTree/js/jquery.ztree.exedit.js?v=${.Config.basic.version}"></script>
    <!-- <script src="/plugins/echart/echarts.min.js"></script> -->
    <script src="../plugins/echart/echarts-4.8.min.js?v=${.Config.basic.version}"></script>
    <script src="../dashboard/js/jquery.liMarquee.js?v=${.Config.basic.version}"></script>
    <script src="../plugins/jtopo/jtopo_fixbug.js"></script>
    <script src="../plugins/jquery.slimscroll.min.js"></script>
    <script src="../plugins/toastr/toastr.min.js"></script>
    <script src="../plugins/moment.min.js"></script>
    <script src="../js/utils.js?v=${.Config.basic.version}"></script>
    <script src="../js/func.js?v=${.Config.basic.version}"></script>
    <script>
        var lay_index = null;
        var zTree = null;
        var table = null;
        var laydate = null;
        var form = null;
        var element = null;
        var laydate=null;
        //var transfer=null;
        var actions = null;
        var token = window.localStorage.getItem("token");
        var user_info = JSON.parse(window.localStorage.getItem("user_info"));
        console.info(user_info);
        var func_url = "${.func_url}";
        var farms = null;
        var houses = null;
        //var curfarm_ = null;
        //var cur_farm_id = null;
        var cur_house = null;
        var cur_houseid = null;
        var cur_housename = null;
        var request = getRequest();
        console.info(request);
        if (request) {
            if (request.farmid) {
                cur_farm_id = request.farmid;
            }else{
                //cur_farm_id = user_info.default_farm;
            }
        }
        var cur_alarm_data = [];

        var tab_idx = 0;

        var DaySumFeedType = "DaySumFeedTotal";
        var HouseType = "";

        var AlarmType ="alarm";
        var AlarmRange = "";
        var AlarmLevel = "1";
        
        var AlarmBegin = "";
        var AlarmEnd = "";

        var GwType = "";

        var begin = moment().add(-1, 'months').format('YYYY-MM-DD');
        //var end = moment().add(0, 'months').format('YYYY-MM-DD HH:mm');
        var end = moment().add(-1, 'days').format('YYYY-MM-DD');

        var today = moment().format('YYYY-MM-DD');
        var yesterday = moment().add(-1, 'days').format('YYYY-MM-DD');
        var tomorrow = moment().add(1, 'days').format('YYYY-MM-DD');

        const maskColor = "#ffffff";
        const redColor = "#FF3366";
        const greenColor = "#009900";
        const blueColor = "#1e9fff";
        const grayColor = "#3e4144";
        const cyanColor = "#6ed0e0";
        const waterColor = "#4168ff";
        const lightGreenColor = "#429c5e";
        const lightOrangeColor = "#f47011";
        const lightOrangeColor1 = "#ff9e18";
        const lightOrangeColor2 = "#ffee01";
        const co2Color = "#91c7ae";
        const gasColor = "#61a0a8";
        const titleColor = "#333";
        const nanmu_orange = "#F29114";
        const nanmu_blue = "#00A1BA";
        const nanmu_green = "#33ff3d";
        const blue="#4168ff";
        const green="#31c2b0";
        var chartDayAvgFeed = null;
        var chartDaySumFeed = null;
        var chartHouseSort = null;
        var chartAchievementRate = null;

        var chartDayAvgFeedDay=[];
        var chartHouseSortDay = [];
        var hour_his_chart = null;

        var houseDayFeed = [];
        var farmDayFeed = [];

        var chartDayAvgFeedOptions = {
            backgroundColor:'#ffffff',
            legend: {
                show: true,
                x: 'center',
                y: '10',
                icon: 'stack',
                itemWidth: 10,
                itemHeight: 10,
                textStyle: {
                    fontSize: 11,
                    color: '#666'
                },
                data: ['头均采食量(kg)', "头均饮水量(L)","超采食量(kg)","低采食量(kg)"]
            },
            toolbox: {
                show: true,
				right:10,
                itemSize:12,
                iconStyle:{
                    //color:'#ffffff',
                },
                feature: {
                    saveAsImage: {
                        title: '保存图片',
                    },
                    myExport: {
                        show: true,
						title: '导出Excel',
						icon: 'path://M832 1024H192a64 64 0 0 1-64-64V64a64 64 0 0 1 64-64h448v3.968L896 256v704a64 64 0 0 1-64 64zM640 127.488V256h129.472L640 127.488zM832 320h-192a64 64 0 0 1-64-64V64H192v896h640V320z',
                        onclick: function (){
                            onExportDayAvgFeed();
                        }
                    }
                }
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    lineStyle: {
                        color: {
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 0,
                            y2: 1,
                            colorStops: [{
                                offset: 0,
                                color: 'rgba(0, 255, 233,0)'
                            }, {
                                offset: 0.5,
                                color: 'rgba(255, 255, 255,1)',
                            }, {
                                offset: 1,
                                color: 'rgba(0, 255, 233,0)'
                            }],
                            global: false
                        }
                    },
                },
                formatter: function (params) {
                    //console.info(params);
					var html = params[0].name +  "    <span style='color:#6ed0e0;font-size:10px;font-weight:bold; padding-left:5px;'>日龄:"+  chartDayAvgFeedDay[params[0].dataIndex]+"</span>";
					for (var i = 0, l = params.length; i < l; i++) {
						html += '<br/>' + params[i].marker +params[i].seriesName+" "+ params[i].value;
					}
					return html;
				}
            },
            grid: {
                top: '15%',
                left: '5%',
                right: '5%',
                bottom: '15%',
                containLabel: true
            },
            xAxis: [{
                type: 'category',
                boundaryGap: true,
                axisLine: {
                    show: true
                },
                splitArea: {
                    // show: true,
                    color: '#f00',
                    lineStyle: {
                        color: '#f00'
                    },
                },
                axisLabel: {
                    color: titleColor
                },
                splitLine: {
                    show: false
                },
                //boundaryGap: false,
                //data: ['A', 'B', 'C', 'D', 'E', 'F'],

            }],
            yAxis: [{
                type: 'value',
                min: 0,
                splitLine: {
                    show: false,
                    lineStyle: {
                        color: 'rgba(255,255,255,0.1)'
                    }
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    show: true,
                    margin: 20,
                    textStyle: {
                        color: titleColor,
                    },
                    formatter:'{value} kg',
                },
                axisTick: {
                    show: true,
                },
            }, {
                type: 'value',
                min: 0,
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: 'rgba(255,255,255,0.1)'
                    }
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    show: true,
                    margin: 20,
                    textStyle: {
                        color: titleColor,
                    },
                    formatter:'{value} L',
                },
                axisTick: {
                    show: true,
                },
            }],
            series: [
                {
                    name: '头均采食量(kg)',
                    type: 'bar',
                    //symbolSize: 3,
                    smooth: true, //是否平滑
                    showSymbol: true,
                    // symbol: 'image://./static/images/guang-circle.png',
                    //symbol: 'none',
                    yAxisIndex: 0,

                    areaStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                offset: 0,
                                color: lightOrangeColor1
                            }, {
                                offset: 0.8,
                                color: 'rgba(255,255,255,0)'
                            }], false),
                            // shadowColor: 'rgba(255,255,255, 0.1)',
                            shadowBlur: 10,
                            //opacity: 0.3,
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            lineStyle: {
                                width: 1,
                                type: 'solid' //'dotted'虚线 'solid'实线
                            },
                            borderColor: lightOrangeColor1, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            //opacity: 0.5,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                },
                {
                    name: '头均饮水量(L)',
                    type: 'bar',
                    smooth: true, //是否平滑
                    showSymbol: true,
                    yAxisIndex: 1,
                    areaStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                offset: 0,
                                color: '#00c7d9'
                            }, {
                                offset: 0.8,
                                color: waterColor
                            }], false),
                            // shadowColor: 'rgba(255,255,255, 0.1)',
                            shadowBlur: 10,
                            //opacity: 0.3,
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: waterColor,
                            lineStyle: {
                                width: 1,
                                type: 'solid' //'dotted'虚线 'solid'实线
                            },
                            borderColor: waterColor, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            //opacity: 0.5,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                }
                ,{
                    name: '超采食量(kg)',
                    type: 'line',
                    //symbolSize: 3,
                    smooth: true, //是否平滑
                    showSymbol: true,
                    // symbol: 'image://./static/images/guang-circle.png',
                    //symbol: 'none',
                    yAxisIndex: 0,
                    itemStyle: {
                        normal: {
                            color: redColor,
                            lineStyle: {
                                width: 1,
                                type: 'solid' //'dotted'虚线 'solid'实线
                            },
                            borderColor: redColor, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            opacity: 0.5,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                },
                {
                    name: '低采食量(kg)',
                    type: 'line',
                    //symbolSize: 3,
                    smooth: true, //是否平滑
                    showSymbol: true,
                    // symbol: 'image://./static/images/guang-circle.png',
                    //symbol: 'none',
                    yAxisIndex: 0,

                    itemStyle: {
                        normal: {
                            color: lightOrangeColor,
                            lineStyle: {
                                width: 1,
                                type: 'solid' //'dotted'虚线 'solid'实线
                            },
                            borderColor: lightOrangeColor, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            opacity: 0.5,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                },
            ]
        };
        var chartDaySumFeedOptions = {
            backgroundColor:'#ffffff',
            legend: {
                show: true,
                x: 'center',
                y: '10',
                icon: 'stack',
                itemWidth: 10,
                itemHeight: 10,
                textStyle: {
                    fontSize: 11,
                    color: '#666'
                },
                //data: ['采食量(kg)', '饮水量(L)'],
            },
            toolbox: {
                show: true,
				right:10,
                itemSize:12,
                iconStyle:{
                    //color:'#ffffff',
                },
                feature: {
                    saveAsImage: {
                        title: '保存图片',
                    },
                    myExport: {
                        show: true,
						title: '导出Excel',
						icon: 'path://M832 1024H192a64 64 0 0 1-64-64V64a64 64 0 0 1 64-64h448v3.968L896 256v704a64 64 0 0 1-64 64zM640 127.488V256h129.472L640 127.488zM832 320h-192a64 64 0 0 1-64-64V64H192v896h640V320z',
                        onclick: function (){
                            onExportDaySumFeed();
                        }
                    }
                }
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '15%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    boundaryGap: true,
                    data: [],
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        //alignWithLabel: true,
                        //interval: 0,
                        //rotate: '15'
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        formatter:'{value} kg',
                    },
                },
                {
                    type: 'value',
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        formatter:'{value} L',
                    },
                }
            ],
            series: [
                {
                    name: '采食量(kg)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth: '10px',
                    yAxisIndex: 0,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            barBorderRadius: [30, 30, 30, 30],
                            shadowColor: lightOrangeColor1,
                            shadowBlur: 1,
                        }
                    },
                },
                {
                    name: '饮水量(L)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth: '10px',
                    yAxisIndex: 1,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: waterColor,
                            barBorderRadius: [30, 30, 30, 30],
                            shadowColor: blueColor,
                            shadowBlur: 1,
                        }
                    },
                },
                {
                    name: '目标采食量(kg)',
                    type: 'line',
                    smooth: false, //是否平滑
                    showSymbol: true,
                    yAxisIndex: 0,
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            lineStyle: {
                                width: 1,
                                type: 'dotted' //'dotted'虚线 'solid'实线
                            },
                            borderColor: lightOrangeColor1, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            opacity:0.9,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                }
            ]
        };
        var chartHouseSortOptions = {
            backgroundColor:'#ffffff',
            legend: {
                show: true,
                x: 'center',
                y: '10',
                icon: 'stack',
                itemWidth: 10,
                itemHeight: 10,
                textStyle: {
                    fontSize: 11,
                    color: '#666'
                },
                //data: ['采食量(kg)', '饮水量(L)'],
            },
            toolbox: {
                show: true,
				right:10,
                itemSize:12,
                iconStyle:{
                    //color:'#ffffff',
                },
                feature: {
                    saveAsImage: {
                        title: '保存图片',
                    },
                    myExport: {
                        show: true,
						title: '导出Excel',
						icon: 'path://M832 1024H192a64 64 0 0 1-64-64V64a64 64 0 0 1 64-64h448v3.968L896 256v704a64 64 0 0 1-64 64zM640 127.488V256h129.472L640 127.488zM832 320h-192a64 64 0 0 1-64-64V64H192v896h640V320z',
                        onclick: function (){
                            onExportHouseSort();
                        }
                    }
                }
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                },
                formatter: function (params) {
                    //console.info(params);
					var html = params[0].name +  "    <span style='color:#6ed0e0;font-size:10px;font-weight:bold; padding-left:5px;'>日龄:"+  chartHouseSortDay[params[0].dataIndex]+"</span>";
					for (var i = 0, l = params.length; i < l; i++) {
						html += '<br/>' + params[i].marker +params[i].seriesName+" "+ params[i].value;
					}
					return html;
				}
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '15%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    boundaryGap: true,
                    data: [],
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        //alignWithLabel: true,
                        //interval: 0,
                        //rotate: '15'
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    position:"left",
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        formatter:'{value} kg',
                    },
                },
                {
                    type: 'value',
                    position:"right",
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        formatter:'{value} kg',
                    },
                },
                {
                    type: 'value',
                    position:"left",
                    offset:50,
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        formatter:'{value} L',
                    },
                }
                ,
                {
                    type: 'value',
                    position:"right",
                    offset:50,
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.05)'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: titleColor
                        },
                        formatter:'{value} 天',
                    },
                }
            ],
            series: [
                {
                    name: '总采食量(kg)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth: '10px',
                    yAxisIndex: 0,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            //barBorderRadius: [30, 30, 30, 30],
                            //shadowColor: '#f29725',
                            //shadowBlur: 4,
                        }
                    },
                },
                {
                    name: '头均采食量(kg)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth: '10px',
                    yAxisIndex: 1,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            //barBorderRadius: [30, 30, 30, 30],
                            //shadowColor: '#f29725',
                            //shadowBlur: 4,
                        }
                    },
                },
                {
                    name: '总饮水量(L)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth: '10px',
                    yAxisIndex: 2,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: waterColor,
                            //barBorderRadius: [30, 30, 30, 30],
                            //shadowColor: blueColor,
                            //shadowBlur: 4,
                        }
                    },
                }
                ,
                /*{
                    name: '日龄(天)',
                    type: 'line',
                    smooth: false, //是否平滑
                    showSymbol: true,
                    yAxisIndex: 3,
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            lineStyle: {
                                width: 1,
                                type: 'dotted' //'dotted'虚线 'solid'实线
                            },
                            borderColor: lightOrangeColor1, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            opacity:0.5,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                }*/
            ]
        };
        var myColor = [
            "#eb2100",
            "#eb3600",
            "#d0570e",
            "#d0a00e",
            "#34da62",
            "#00e9db",
            "#00c0e9",
            "#0096f3",
            "#33CCFF",
            "#33FFCC",
        ];
        var chartAchievementRateOptions = {
            // title: [{
            //     text: '城市排名',
            //     x: 'center',
            //     y: '3%',
            //     textStyle: {
            //         fontSize: 12,
            //         fontWeight: 'bold',
            //         fontStyle: 'normal',
            //         color: 'rgba(255,255,255,.7)',
            //     }
            // }],
            tooltip: {
                trigger: "axis",
                show: true,
                axisPointer: {
                    // 坐标轴指示器，坐标轴触发有效
                    type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
                },
            },
            legend: {
                show: true,
            },
            grid: {
                top: "15%",
                left: "5%",
                right: "15%",
                bottom: "10%",
                containLabel: true,
            },
            xAxis: [
                {

                    type: "value",
                    show: true,
                    axisLabel: {
                        show: false,
                    },
                    axisLine: {
                        show: false,
                    },
                    splitLine: {
                        show: false,
                    },
                },
            ],
            yAxis: [
                {
                    splitLine: {
                        show: false,
                    },
                    axisLine: {
                        //y轴
                        show: false,
                    },
                    type: "category",
                    axisTick: {
                        show: false,
                    },
                    inverse: true,
                    data: ["龙岩", "武汉", "东莞", "中山", "其他"],
                    axisLabel: {
                        textStyle: {
                            color: 'rgba(0,0,0,.5)',
                            fontSize: 13,
                        },
                    },
                },
            ],
            series: [
                {
                    //name: "在线情况",
                    type: "bar",
                    barWidth: 8, // 柱子宽度
                    label: {
                        show: true,
                        position: "right", // 位置
                        color: 'rgba(0,0,0,.5)',
                        fontSize: 12,
                        distance: 12, // 距离
                        formatter: "{c} ", // 这里是数据展示的时候显示的数据
                    },

                    itemStyle: {
                        normal: {
                            color: function (params) {
                                console.info(params);
                                var num = myColor.length;
                                var color = myColor[params.dataIndex % num];
                                console.info(color);
                                return color;
                            },
                            barBorderRadius: 14,
                        },
                    },
                    data: [28, 16, 12, 8, 3],
                },
                /*{
                    type: "bar",
                    barWidth: 9,
                    xAxisIndex: 0,
                    barGap: "-100%",
                    data: [100, 100, 100],
                    itemStyle: {
                        normal: {
                            //color: "#444a58",
                            color: 'rgba(0,0,0,.2)',
                            barBorderRadius: 14,
                        },
                    },
                    zlevel: -1,
                }*/
            ],
        }
        var hour_his_chart_options = {
            backgroundColor:'#ffffff',
            legend: {
                show:true,
                x:'center',
                y:'10',
                icon: 'stack',
                itemWidth:10,
                itemHeight:10,
                textStyle: {
                    fontSize: 11,
                    color: titleColor
                },
                data:[{name:'小时总下料量(kg)',icon:'rect'},{name:'小时总下水量(L)',icon:'rect'},{name:"小时头均下料量(kg)",icon:'circle'}]
            },
            toolbox: {
                show: true,
                right:10,
                itemSize:12,
                iconStyle:{
                    //color:'#ffffff',
                },
                feature: {
                    saveAsImage: {
                        title: '保存图片',
                    },
                    myExport: {
                        show: true,
                        title: '导出Excel',
                        icon: 'path://M832 1024H192a64 64 0 0 1-64-64V64a64 64 0 0 1 64-64h448v3.968L896 256v704a64 64 0 0 1-64 64zM640 127.488V256h129.472L640 127.488zM832 320h-192a64 64 0 0 1-64-64V64H192v896h640V320z',
                        onclick: function (){
                            onExportHourFeed();
                        }
                    }
                }
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    lineStyle: {
                        color: {
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 0,
                            y2: 1,
                            colorStops: [{
                                offset: 0,
                                color: 'rgba(0, 255, 233,0)'
                            }, {
                                offset: 0.5,
                                color: 'rgba(255, 255, 255,1)',
                            }, {
                                offset: 1,
                                color: 'rgba(0, 255, 233,0)'
                            }],
                            global: false
                        }
                    },
                }
            },
            
            grid: {
                top: '20%',
                left: '5%',
                right: '5%',
                bottom: '15%',
                containLabel: true
            },
            xAxis: [{
                type: 'category',
                axisLine: {
                    show: true
                },
                splitArea: {
                    // show: true,
                    color: '#f00',
                    lineStyle: {
                        color: '#f00'
                    },
                },
                axisLabel: {
                    color: titleColor
                },
                splitLine: {
                    show: false
                },
                boundaryGap: false,
                //data: ['A', 'B', 'C', 'D', 'E', 'F'],

            }],
            yAxis: [{
                type: 'value',
                min: 0,
                max: function (value) {
                    return value.max + 1;
                },
                splitLine: {
                    show: false,
                    lineStyle: {
                        color: 'rgba(255,255,255,0.1)'
                    }
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    show: true,
                    margin: 20,
                    textStyle: {
                        color: titleColor,

                    },
                },
                axisTick: {
                    show: true,
                },
            },{
                type: 'value',
                min: 0,
                max: function (value) {
                    return value.max + 1;
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: 'rgba(255,255,255,0.1)'
                    }
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    show: true,
                    margin: 20,
                    textStyle: {
                        color: titleColor,

                    },
                },
                axisTick: {
                    show: true,
                },
            }],
            series: [{
                    name: '小时总下料量(kg)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth:'5px',
                    yAxisIndex: 1,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: nanmu_green,
                            // barBorderRadius: [30, 30, 30, 30],
                            // shadowColor: '#f29725',
                            // shadowBlur: 4,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                },{
                    name: '小时总下水量(L)',
                    type: 'bar',
                    //barWidth: '10px',
                    barMaxWidth:'5px',
                    yAxisIndex: 1,
                    data: [],
                    itemStyle: {
                        normal: {
                            color: blue,
                            // barBorderRadius: [30, 30, 30, 30],
                            // shadowColor: '#f29725',
                            // shadowBlur: 4,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                }
                ,{
                    name: '小时头均下料量(kg)',
                    type: 'line',
                    smooth: false, //是否平滑
                    showSymbol: true,
                    yAxisIndex: 1,
                    itemStyle: {
                        normal: {
                            color: lightOrangeColor1,
                            lineStyle: {
                                width: 1,
                                type: 'dotted' //'dotted'虚线 'solid'实线
                            },
                            borderColor: lightOrangeColor1, //图形的描边颜色。支持的格式同 color
                            //borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
                            barBorderRadius: 0,
                            label: {
                                show: false,
                            },
                            opacity:0.5,
                        }
                    },
                    tooltip: {
                        show: true
                    }
                }
            ]
        };
        var vm_farm = new Vue({
            el: '.farm',
            data: {
                pig_num_total: '-',
                num_stop: '-',
                today_feed: '-',
                yestoday_feed: '-',
                today_water: '-',
                yestoday_water: '-',
                today_feed_diff:0,
                today_water_diff:0,
                online_num: 0,
                offline_num: 0,
                alarm_device_num: 0,
                son_total: '-',
                pig_num1: '-',
                pig_num2: '-',
                pig_num3: '-',
                pig_num4: '-',
                pig_num5: '-',
                house_num: '-',
                gw_num: '-',
                gw_alive_num: '-',
                gw_all_online:false,

                province:'',
                city:'',
                address:"",
                person:"",
                phone:"",
                farmname:"",
            },
            methods: {
            }
        });

        var vm_house = new Vue({
            el: '.house',
            data: {
                list: []
            },
            methods: {
            },
            mounted: function () {
                
            },
            watch:{
                list:function(){
                    this.$nextTick(function(){
                        console.info("house list render ok")
                        element.init()
                    });
                }
            }
        });

        var vm_house_sort = new Vue({
            el: '.house_sort',
            data: {
                list: []
            },
            methods: {
            },
            mounted: function () {
                
            },
            watch:{
                list:function(){
                    this.$nextTick(function(){
                        console.info("house_sort list render ok")
                        element.init()
                    });
                }
            }
        });

        var vm_alarm = new Vue({
            el: '.alarm',
            data: {
                alarm_num:0,
                notice_num:0,
                cancel_num:0,
                total_num:0,
            },
            methods: {
            }
        });

        var vm_gw = new Vue({
            el: '.gw',
            data: {
                list:[],
                online_num:0,
                offline_num:0,
            },
            methods: {
            }
        });

        token = 'Bearer ' + token;
        layui.config({
            base: '../layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index', 'table', 'form', 'element', 'transfer','laydate'], function () {
            $ = layui.$;
            form = layui.form;
            element = layui.element;
            table = layui.table;
            laydate = layui.laydate;
            toastr.options = {
                "closeButton": false, //是否显示关闭按钮
                "debug": false, //是否使用debug模式
                "positionClass": "toast-top-center",//弹出窗的位置
                "showDuration": "300",//显示的动画时间
                "hideDuration": "1000",//消失的动画时间
                "timeOut": "2000", //展现时间
                "extendedTimeOut": "1000",//加长展示时间
                "showEasing": "swing",//显示时的动画缓冲方式
                "hideEasing": "linear",//消失时的动画缓冲方式
                "showMethod": "fadeIn",//显示时的动画方式
                "hideMethod": "fadeOut" //消失时的动画方式
            };

            $.ajax({
                type: 'GET',
                url: '../Api/User/Actions',
                data: { func_url: func_url },
                beforeSend: function (request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (data) {
                    console.info(data)
                    actions = data.data;
                    for (var i = 0; i < actions.length; i++) {
                        $('.action-' + actions[i].action_id).removeClass("layui-hide");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载操作信息失败');
                }
            });

            $.ajax({
                type: 'GET',
                url: '../Api/Farm/List',
                data: {},
                beforeSend: function (request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if (res.code >= 0) {
                        console.info(res.data);
                        farms = res.data;
                        if (farms.length > 0) {
                            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                            if (cur_farm_id) {
                                for (var i = 0; i < farms.length; i++) {
                                    if (farms[i].id == cur_farm_id) {
                                        cur_farm = farms[i];
                                    }
                                }
                            } else {
                                cur_farm_id = farms[0].id;
                                window.localStorage.setItem("cur_farm_id", cur_farm_id);
                                cur_farm = farms[0];
                            }

                            renderFarmSelect();
                            loadAll(cur_farm_id);
                        }

                    } else {
                        layer.alert(res.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function (XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },
            });

            form.on('submit(btn_export)', function(data){
                console.info(data.field);
                //data.field.id = data.field.farmid;
                var date = data.field.daterange.split(" ~ ");
                if(date.length==2){
                    data.field.begin=date[0];
                    data.field.end=date[1];
                }else{
                    return true;
                }
                
                layer.load(1);
                var url=data.field.url+"?"+encodeUrl(data.field);
                console.info(url);

                var xhh = new XMLHttpRequest();
                xhh.open("get", url );
                xhh.setRequestHeader("Authorization", token);
                xhh.setRequestHeader("Content-Type","application/json");
                xhh.responseType = 'blob';
                xhh.onload = function () {
                    layer.closeAll('loading');
                    // 请求完成
                    if (this.status === 200) {
                        // 返回200
                        var blob = this.response;
                        var reader = new FileReader();
                        reader.readAsDataURL(blob);    // 转换为base64，可以直接放入a表情href
                        reader.onload = function (e) {
                            // 转换完成，创建一个a标签用于下载
                            var a = document.createElement('a');
                            a.download = data.field.name+ ".xlsx";
                            a.href = e.target.result;
                            $("body").append(a);    // 修复firefox中无法触发click
                            a.click();
                            $(a).remove();
                        }
                    }else{
                        console.debug(this);
                    }
                };
                xhh.send();

                return false;
            });

            form.render('select');

            //切换
            form.on('select(farm)', function (data) {
                var id = data.value;
                //cur_farm_id = id;
                //console.info("farmid", cur_farm_id);
                //user_info.default_farm = cur_farm_id;
                //window.localStorage.setItem("user_info",JSON.stringify(user_info));
                window.localStorage.setItem("cur_farm_id", id);
                loadAll(id);
            });



            resize();
            initCharts();

            laydate.render({
                elem: '#id-date'
                ,type: 'date'
                //,range: '~'
                , theme: '#3c7cff'
                ,value: yesterday
                ,done: function(value, date, endDate){
                    console.info(value, date, endDate);
                    var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                    loadFarmHouseSummarySort(cur_farm_id,value);
                }
            });
            laydate.render({
                elem: '#id-date1'
                ,type: 'date'
                //,range: '~'
                , theme: '#3c7cff'
                ,value: yesterday
                ,done: function(value, date, endDate){
                    console.info(value, date, endDate);
                    var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                    loadFarmFeedHighLow(cur_farm_id,value);
                }
            });

            element.on('tab(main-tab)', function(data){
                console.log(this); //当前Tab标题所在的原始DOM元素
                console.log(data.index); //得到当前Tab的所在下标
                tab_idx = data.index;
                
                var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                loadAll(cur_farm_id);
            });

            $(".DaySumFeedType a").click(function () {
                $(this).addClass("active").siblings().removeClass("active");

                DaySumFeedType = $(this)[0].dataset.type;
                console.info(DaySumFeedType)
                var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                loadFarmDaySumFeed(cur_farm_id);
            });
            $(".HouseType a").click(function () {
                $(this).addClass("active").siblings().removeClass("active");
                HouseType = $(this)[0].dataset.type;
                console.info(HouseType)
                var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                loadHouseSummaryList(cur_farm_id);
            });
            $(".GwType a").click(function () {
                $(this).addClass("active").siblings().removeClass("active");

                GwType = $(this)[0].dataset.type;
                console.info(GwType)
                var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                loadGw(cur_farm_id);
            });
            $(".AlarmRange a").click(function () {
                $(this).addClass("active").siblings().removeClass("active");

                AlarmRange = $(this)[0].dataset.type;
                console.info(AlarmRange)
                if(AlarmRange=="all"){
                    AlarmBegin = "";
                    AlarmEnd ="";
                }else if(AlarmRange=="today"){
                    AlarmBegin = moment().format('YYYY-MM-DD');
                    AlarmEnd = "";
                }else if(AlarmRange=="week"){
                    AlarmBegin = moment().add(-7,"days").format('YYYY-MM-DD');
                    AlarmEnd = "";
                }else if(AlarmRange=="month"){
                    AlarmBegin = moment().add(-1,"months").format('YYYY-MM-DD');
                    AlarmEnd = "";
                }
                var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                loadAlarm(cur_farm_id);
            });
            $(".AlarmTypeItem").click(function () {
                $(".AlarmTypeItem").removeClass("active");
                $(this).addClass("active");

                AlarmType = $(this)[0].dataset.type;
                console.info(AlarmType)
                if(AlarmType=="all"){
                    AlarmLevel = "";
                    
                }else if(AlarmType=="notice"){
                    AlarmLevel = "0";
                }else if(AlarmType=="alarm"){
                    AlarmLevel = "1";
                    
                }else if(AlarmType=="cancel"){
                    AlarmLevel = "";
                }
                var cur_farm_id = window.localStorage.getItem("cur_farm_id");
                loadAlarm(cur_farm_id);
            });
        });

        function loadAll(farmid) {
            if(tab_idx==0){
                loadFarmInfo(farmid);
                loadFarmSummaryInfo(farmid);
                loadAlarmSumary(farmid);
                loadHouseSelect(farmid);
                
                setTimeout(function(){var date = $("#id-date").html(); loadFarmHouseSummarySort(farmid,date);},500);
                
                setTimeout(function(){var date = $("#id-date1").html();loadFarmFeedHighLow(farmid,date);},500);
                
                loadFarmDaySumFeed(farmid);

                
                resize();
            }else if(tab_idx==1){
                loadHouseSummaryList(farmid);
                loadAlarmSumary(farmid);
            }else if(tab_idx==2){
                loadAlarm(farmid);
                loadAlarmSumary(farmid);
            }else if(tab_idx==3){
                loadGw(farmid);
                loadAlarmSumary(farmid);
            }
        }
        
        function loadFarmInfo(farmid){
            $.ajax({
                type: 'GET',
                url: '../Api/Farm',
                data: {id:farmid},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        if(res.count>0){
                            var obj=res.data[0];
                            console.info(obj);
                            vm_farm.province = obj.province;
                            vm_farm.city = obj.city;
                            vm_farm.address = obj.address;
                            vm_farm.person = obj.person;
                            vm_farm.phone = obj.phone;
                            vm_farm.farmname = obj.farmname;
                        }
                    }else{
                        toastr.warning(res.msg, "异常");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });
        }

        function loadFarmSummaryInfo(farmid){
            $.ajax({
                type: 'GET',
                url: '../Api/Farm/SummaryInfo',
                data: {id:farmid},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        var obj=res.data;
                        console.info(obj);
                        //vm_farm.pig_num_total = obj.pig_num_total;
                        if(obj.pig_num_total>0){
                            vm_farm.pig_num_total = obj.pig_num_total;
                        }else{
                            vm_farm.pig_num_total = "-";
                        }

                        //vm_farm.num_stop = obj.num_stop;
                        

                        if(obj.today_feed){
                            vm_farm.today_feed =parseFloat((obj.today_feed/1000).toFixed(3));
                        }else{
                            vm_farm.today_feed = 0;
                        }
                        if(obj.yestoday_feed){
                            vm_farm.yestoday_feed =parseFloat((obj.yestoday_feed/1000).toFixed(3));
                        }else{
                            vm_farm.yestoday_feed = 0;
                        }
                        if(obj.today_water){
                            vm_farm.today_water =parseFloat((obj.today_water/1000).toFixed(3));
                        }else{
                            vm_farm.today_water = 0;
                        }
                        if(obj.yestoday_water){
                            vm_farm.yestoday_water =parseFloat((obj.yestoday_water/1000).toFixed(3));
                        }else{
                            vm_farm.yestoday_water = 0;
                        }
                        
                        if(vm_farm.today_feed>0){
                            vm_farm.today_feed_diff = parseFloat(((vm_farm.today_feed - vm_farm.yestoday_feed) / vm_farm.today_feed * 100).toFixed(1));
                        }else{
                            vm_farm.today_feed_diff = 0;
                        }

                        if(vm_farm.today_water>0){
                            vm_farm.today_water_diff = parseFloat(((vm_farm.today_water - vm_farm.yestoday_water) / vm_farm.today_water * 100).toFixed(1));
                        }else{
                            vm_farm.today_water_diff = 0;
                        }
                        
                        //vm_farm.today_water_diff = parseFloat(((vm_farm.today_water - vm_farm.yestoday_water) / vm_farm.today_water * 100).toFixed(1));
                        if(user_info.userid=="18688255128"){
                            obj.online_num = 520;
                            obj.offline_num = 0;
                            obj.num_stop = 520;
                        }else{

                        }
                        if(obj.num_stop>0){
                            vm_farm.num_stop = obj.num_stop;
                        }else{
                            vm_farm.num_stop = "-";
                        }
                        if(obj.online_num>0){
                            vm_farm.online_num = obj.online_num;
                        }else{
                            vm_farm.online_num = 0;
                        }
                        if(obj.offline_num>0){
                            vm_farm.offline_num = obj.offline_num;
                        }else{
                            vm_farm.offline_num = 0;
                        }
                        if(obj.alarm_device_num>0){
                            vm_farm.alarm_device_num = obj.alarm_device_num;
                        }else{
                            vm_farm.alarm_device_num = "-";
                        }
                        vm_farm.son_total = obj.son_total;
                        vm_farm.pig_num1 = obj.pig_num1;
                        vm_farm.pig_num2 = obj.pig_num2;
                        vm_farm.pig_num3 = obj.pig_num3;
                        vm_farm.pig_num4 = obj.pig_num4;
                        vm_farm.pig_num5 = obj.pig_num5;
                        vm_farm.pig_num6 = obj.pig_num6;
                        vm_farm.house_num = obj.house_num;
                        vm_farm.gw_num = obj.gw_num;
                        vm_farm.gw_alive_num = obj.gw_alive_num;
                        if(obj.gw_num == obj.gw_alive_num){
                            vm_farm.gw_all_online = 1;
                        }else{
                            vm_farm.gw_all_online = 0;
                        }
                        //console.info(JSON.stringify(vm_farm));
                    }else{
                        toastr.warning(res.msg, "异常");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });
        }
        

        //加载单元下拉
        function loadHouseSelect(farmid){
            getHouseList(farmid).then(function(res) {
                if(res && res.code>=0){
                    var list = res.data;
                    renderHouseSelect(list);
                    form.on('select(house)', function (data) {
                        console.info("list:",list);
                        var id = data.value;
                        cur_houseid = id;
                        for(var i=0;i<list.length;i++){
                            if(cur_houseid == list[i].id){
                                cur_housename = list[i].housename;
                                break
                            }
                        }
                        console.info("cur_houseid", cur_houseid);
                        setTimeout(function(){loadHouseDayAvgFeed(cur_houseid);},200);
                    });
                    if(cur_houseid){
                        setTimeout(function(){loadHouseDayAvgFeed(cur_houseid);},200);
                    }
                }
            });
        }

        //采食量预警
        function loadFarmFeedHighLow(farmid,his_date){
            console.info("loadFarmFeedHighLow",farmid,his_date);
            getStatusHis(farmid,"",his_date).then(function(res) {
                if(res && res.code>=0){
                    var list = res.data;
                    var highNum = 0;
                    var lowNum = 0;
                    var standardNum = 0;
                    if (list && list.length > 0) {
                        for(var i=0;i<list.length;i++){
                            var item  = list[i];
                            if(item.health && item.mode>0){
                                if(item.health=="good"){
                                    standardNum++;
                                }else if(item.health=="low"){
                                    lowNum++;
                                }else if(item.health=="high"){
                                    highNum++;
                                }
                            }
                        }


                    }else{
                        
                    }

                    var valueArr = 
                    [
                        {
                            value: standardNum,
                            itemStyle: {
                                color: new echarts.graphic.LinearGradient(
                                    1,
                                    0,
                                    0,
                                    0,
                                    [
                                        {
                                            offset: 0,
                                            color: "#57eabf", // 0% 处的颜色
                                        },
                                        {
                                            offset: 1,
                                            color: "#2563f9", // 100% 处的颜色
                                        },
                                    ],
                                    false
                                )
                            }
                        },
                        {
                            value: highNum,
                            itemStyle: {
                                color: redColor // 第一个柱子的颜色为红色
                            }
                        },
                        {
                            value: lowNum,
                            itemStyle: {
                                color:  lightOrangeColor// 第一个柱子的颜色为红色
                            }
                        }
                    ];
                    var nameArr = ["采食达标", "超量采食", "低采食量"];
                    chartAchievementRateOptions.yAxis[0].data = nameArr;
                    chartAchievementRateOptions.series[0].data = valueArr;
                    //chartAchievementRateOptions.series[1].data = [1010, 1010, 1010];
                    setTimeout(function () {
                        chartAchievementRate.setOption(chartAchievementRateOptions);
                    }, 500);
                    
                }else{
                    layer.alert(res.msg);
                }
            });

            /*$.ajax({
                type: 'GET',
                url: '../Api/Farm/FeedHighLow',
                data: {id:farmid},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        var obj=res.data;
                        console.info(obj);
                        var valueArr = 
                        [
                            {
                                value: obj.normal,
                                itemStyle: {
                                    color: new echarts.graphic.LinearGradient(
                                        1,
                                        0,
                                        0,
                                        0,
                                        [
                                            {
                                                offset: 0,
                                                color: "#57eabf", // 0% 处的颜色
                                            },
                                            {
                                                offset: 1,
                                                color: "#2563f9", // 100% 处的颜色
                                            },
                                        ],
                                        false
                                    )
                                }
                            },
                            {
                                value: obj.high,
                                itemStyle: {
                                    color: lightOrangeColor // 第一个柱子的颜色为红色
                                }
                            },
                            {
                                value: obj.low,
                                itemStyle: {
                                    color: redColor // 第一个柱子的颜色为红色
                                }
                            }
                        ];
                        var nameArr = ["采食达标", "超量采食", "低采食量"];
                        chartAchievementRateOptions.yAxis[0].data = nameArr;
                        chartAchievementRateOptions.series[0].data = valueArr;
                        //chartAchievementRateOptions.series[1].data = [1010, 1010, 1010];
                        setTimeout(function () {
                            chartAchievementRate.setOption(chartAchievementRateOptions);
                        }, 500);
                    }else{
                        toastr.warning(res.msg, "异常");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });*/
        }

        //加载栏舍汇总排名
        function loadFarmHouseSummarySort(farmid,his_date){
            if (chartHouseSort) {
                chartHouseSort.showLoading({
                    text: 'loading',
                    color: '#3c7cff',
                    textColor: '#3c7cff',
                    maskColor: maskColor,
                    zlevel: 0
                });
            }
            $.ajax({
                type: 'GET',
                url: '../Api/Farm/HouseSummarySort',
                data: {farmid:farmid,his_date:his_date},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if (res.code >= 0) {
                        var name_arr = [];
                        var val_arr = [];
                        var val1_arr = [];
                        var val2_arr = [];
                        var per_arr = [];
                        var day_arr = [];
                        for (var i = 0; i < res.data.length; i++) {
                            var his = res.data[i];
                            his.feed = parseFloat(his.feed);
                            his.water = parseFloat(his.water);
                            his.per = his.per|0;
                            his.day = his.day|0;
                            his.pig_num_total = his.pig_num_total|0;
                            his.pig_num = his.pig_num|0;
                            his.feed_avg = 0;
                            if(his.pig_num_total>0){
                                his.feed_avg = (his.feed/his.pig_num_total);
                            }else{

                            }
                            
                            val_arr.push(parseFloat(his.feed.toFixed(2)));
                            val1_arr.push(parseFloat(his.feed_avg.toFixed(2)));
                            val2_arr.push(parseFloat(his.water.toFixed(2)));
                            per_arr.push(parseFloat(his.per.toFixed(2)));
                            day_arr.push(parseInt(his.day));
                            name_arr.push(his.housename);
                        }

                        chartHouseSortDay = day_arr;
                        chartHouseSortOptions.series[0].data = val_arr;
                        chartHouseSortOptions.series[1].data = val1_arr;
                        chartHouseSortOptions.series[2].data = val2_arr;
                        //chartHouseSortOptions.series[3].data = day_arr;
                        chartHouseSortOptions.xAxis[0].data = name_arr;
                        setTimeout(function () {
                            chartHouseSort.setOption(chartHouseSortOptions);
                        }, 200);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                    if (chartHouseSort) {
                        chartHouseSort.hideLoading();
                    }
                },
            });
        }

        //加载栏舍信息列表
        function loadHouseSummaryList(farmid) {
            vm_house.list= [];
            layer.load(1);
            $.ajax({
                type: 'GET',
                url: '../Api/House/SummaryInfo',
                data: {farmid:farmid,house_type:HouseType},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        var houses = res.data;
                        if(houses){
                            for(var i=0;i<houses.length;i++){
                                if(houses[i].today_feed){
                                    houses[i].today_feed = parseFloat(houses[i].today_feed.toFixed(1));
                                }else{
                                    houses[i].today_feed = 0;
                                }

                                if(houses[i].yestoday_feed){
                                    houses[i].yestoday_feed = parseFloat(houses[i].yestoday_feed.toFixed(1));
                                }else{
                                    houses[i].yestoday_feed = 0;
                                }
                                if(houses[i].max_feed){
                                    houses[i].max_feed = parseFloat(houses[i].max_feed.toFixed(1));
                                }else{
                                    houses[i].max_feed = 0;
                                }
                                
                                
                                if(houses[i].max_feed>0){
                                    houses[i].feed_per = parseFloat(((houses[i].today_feed/houses[i].max_feed)*100).toFixed(1));
                                }else{
                                    houses[i].feed_per = 0;
                                }
                                
                                houses[i].feed_per_str = houses[i].feed_per+"%";
                                houses[i].feed_per_bar_color = "";
                                houses[i].feed_per_color = "";
                                if(houses[i].feed_per<60){
                                    houses[i].feed_per_bar_color = "layui-bg-red";
                                    houses[i].feed_per_color = "layui-text-red";
                                }else if(houses[i].feed_per>=60 && houses[i].feed_per<98){
                                    houses[i].feed_per_bar_color = "layui-bg-orange";
                                    houses[i].feed_per_color = "layui-text-orange";
                                }else if(houses[i].feed_per>=98){
                                    houses[i].feed_per_bar_color = "layui-bg-green-light";
                                    houses[i].feed_per_color = "layui-text-green-light";
                                }

                                houses[i].online_num = houses[i].online_num|0;
                                houses[i].offline_num = houses[i].offline_num|0;
                                houses[i].device_num = houses[i].online_num + houses[i].offline_num;

                                if(houses[i].device_num>0){
                                    houses[i].online_per = parseFloat(((houses[i].online_num/houses[i].device_num)*100).toFixed(1));
                                }else{
                                    houses[i].online_per = 0;
                                }
                                houses[i].online_per_str = houses[i].online_per+"%";
                                houses[i].online_per_bar_color = "";
                                houses[i].online_per_color = "";
                                if(houses[i].online_per<60){
                                    houses[i].online_per_bar_color = "layui-bg-red";
                                    houses[i].online_per_color = "layui-text-red";
                                }else if(houses[i].online_per>=60 && houses[i].online_per<100){
                                    houses[i].online_per_bar_color = "layui-bg-orange";
                                    houses[i].online_per_color = "layui-text-orange";
                                }else if(houses[i].online_per>=100){
                                    houses[i].online_per_bar_color = "layui-bg-green-light";
                                    houses[i].online_per_color = "layui-text-green-light";
                                }

                                houses[i].pig_num = houses[i].pig_num | 0;
                                houses[i].son_total = houses[i].son_total | 0;
                                houses[i].alarm_device_num = houses[i].alarm_device_num | 0;
                                
                            }
                            vm_house.list= houses;
                        }

                    }else{
                        layer.alert(res.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });
        }
        
        //场区采食汇总
        function loadFarmDaySumFeed(farmid) {
            //layer.load(1);
            if (chartDaySumFeed) {
                chartDaySumFeed.showLoading({
                    text: 'loading',
                    color: '#3c7cff',
                    textColor: '#3c7cff',
                    maskColor: maskColor,
                    zlevel: 0
                });
            }
            $.ajax({
                type: 'GET',
                url: '../Api/Farm/DaySumFeed',
                data: { id: farmid, begin: begin, end: end },
                beforeSend: function (request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if (res.code >= 0) {
                        var day_arr = [];
                        var val_arr = [];
                        var val1_arr = [];
                        var max_arr = [];

                        farmDayFeed = res.data;

                        if (DaySumFeedType == "DaySumFeedTotal") {
                            for (var i = 0; i < res.data.length; i++) {
                                var his = res.data[i];
                                var feed = parseFloat(his.day_use_feed_auto) + parseFloat(his.day_use_feed_man);
                                var water = parseFloat(his.day_use_water_auto) + parseFloat(his.day_use_water_man);
                                val_arr.push(feed.toFixed(2));
                                val1_arr.push(water.toFixed(2));
                                max_arr.push(parseFloat(his.max_feed.toFixed(2)));
                                day_arr.push(moment(his.his_date).format("MM/DD"));
                            }
                            chartDaySumFeedOptions.series[0].data = val_arr;
                            chartDaySumFeedOptions.series[1].data = val1_arr;
                            chartDaySumFeedOptions.xAxis[0].data = day_arr;
                            chartDaySumFeedOptions.series[0].name = "总采食量(kg)";
                            chartDaySumFeedOptions.series[1].name = "总饮水量(L)";
                        } else if (DaySumFeedType == "DaySumFeedAuto") {
                            for (var i = 0; i < res.data.length; i++) {
                                var his = res.data[i];
                                var feed = parseFloat(his.day_use_feed_auto);
                                var water = parseFloat(his.day_use_water_auto);
                                val_arr.push(feed.toFixed(2));
                                val1_arr.push(water.toFixed(2));
                                max_arr.push(parseFloat(his.max_feed.toFixed(2)));
                                day_arr.push(moment(his.his_date).format("MM/DD"));
                            }
                            chartDaySumFeedOptions.series[0].data = val_arr;
                            chartDaySumFeedOptions.series[1].data = val1_arr;
                            chartDaySumFeedOptions.xAxis[0].data = day_arr;
                            chartDaySumFeedOptions.series[0].name = "智能采食量(kg)";
                            chartDaySumFeedOptions.series[1].name = "智能总饮水量(L)";
                        } else if (DaySumFeedType == "DaySumFeedMan") {
                            for (var i = 0; i < res.data.length; i++) {
                                var his = res.data[i];
                                var feed = parseFloat(his.day_use_feed_man);
                                var water = parseFloat(his.day_use_water_man);
                                val_arr.push(feed.toFixed(2));
                                val1_arr.push(water.toFixed(2));
                                max_arr.push(parseFloat(his.max_feed.toFixed(2)));
                                day_arr.push(moment(his.his_date).format("MM/DD"));
                            }
                            chartDaySumFeedOptions.series[0].data = val_arr;
                            chartDaySumFeedOptions.series[1].data = val1_arr;
                            chartDaySumFeedOptions.xAxis[0].data = day_arr;
                            chartDaySumFeedOptions.series[0].name = "手动采食量(kg)";
                            chartDaySumFeedOptions.series[1].name = "手动总饮水量(L)";
                        }


                        chartDaySumFeedOptions.series[2].data = max_arr;
                        setTimeout(function () {
                            chartDaySumFeed.setOption(chartDaySumFeedOptions);
                        }, 200);

                    } else {
                        layer.alert(res.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function (XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                    if (chartDaySumFeed) {
                        chartDaySumFeed.hideLoading();
                    }

                },

            });
        }

        //单元采食
        function loadHouseDayAvgFeed(houseid) {
            //layer.load(1);
            $.ajax({
                type: 'GET',
                url: '../Api/House/DaySumFeed',
                data: {id:houseid,begin:begin,end:end},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){

                        var date_arr = [];
                        var high_standard_arr = [];
                        var low_standard_arr = [];
                        var day_arr = [];
                        var val_arr =[];
                        var val1_arr =[];

                        //console.info(res.data)
                        var last_pig_num = 0;
                        if(res.data.length>0){
                            last_pig_num = res.data[res.data.length-1].pig_num; 
                        }

                        houseDayFeed = res.data;
                        for(var i=0;i<res.data.length;i++){
                            var his = res.data[i];
                            var pig_num = his["pig_num"];
                            if(!his.high_standard){
                                his.high_standard = 0;
                            }
                            if(!his.low_standard){
                                his.low_standard = 0;
                            }

                            var feed = parseFloat(his.day_use_feed_auto)+parseFloat(his.day_use_feed_man);
                            var water = parseFloat(his.day_use_water_auto)+parseFloat(his.day_use_water_man);
                            var day = parseInt(his.day);
                            
                            var high_standard = parseFloat(his.high_standard.toFixed(2));
                            var low_standard = parseFloat(his.low_standard.toFixed(2));

                            day_arr.push(day);
                            high_standard_arr.push(high_standard);
                            low_standard_arr.push(low_standard);

                            date_arr.push(moment(his.his_date).format("MM/DD") );

                            if(pig_num && pig_num>0){
                                val_arr.push((feed/pig_num).toFixed(2));
                                val1_arr.push((water/pig_num).toFixed(2));
                                last_pig_num = pig_num;
                                console.info("last_pig_num=",last_pig_num)
                            }else{
                                console.info("pig_num缺失，使用last_pig_num",last_pig_num)
                                val_arr.push((feed/last_pig_num).toFixed(2));
                                val1_arr.push((water/last_pig_num).toFixed(2));
                            }
                        }

                        chartDayAvgFeedDay = day_arr;

                        chartDayAvgFeedOptions.series[0].data= val_arr;
                        chartDayAvgFeedOptions.series[1].data= val1_arr;
                        chartDayAvgFeedOptions.series[2].data = high_standard_arr;
                        chartDayAvgFeedOptions.series[3].data = low_standard_arr;
                        //chartDayAvgFeedOptions.series[4].data = day_arr;
                        chartDayAvgFeedOptions.xAxis[0].data = date_arr;

                        setTimeout(function(){
                            chartDayAvgFeed.setOption(chartDayAvgFeedOptions);
                        },200);
                    }else{
                        layer.alert(res.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                    if (chartDayAvgFeed) {
                        chartDayAvgFeed.hideLoading();
                    }
                },

            });
        }

        function loadAlarm(farmid){
            var hide = false;
            var alarm_notice_title='';
            if(AlarmType!="notice"){
                alarm_notice_title = "告警内容";
            }else{
                alarm_notice_title = "通知内容";
                hide = true;
            }

            var hide_cancel_time = false;
            var hide_dura_time = false;
            var url = '../Api/Alarm/NowPage';
            if(AlarmType=="cancel")
            {
                //已经取消的告警
                url = '../Api/Alarm/Page';
                hide_dura_time = true;
            }
            else if(AlarmType=="notice" || AlarmType=="alarm")
            {
                url = '../Api/Alarm/NowPage';
                hide_cancel_time = true;
            
            }


            table.render({
                elem: '#alarm_table'
                ,url:url
                ,height: 'full-200'
                ,method:'GET'
                ,headers : {'Authorization': 'Bearer '+window.localStorage.getItem("token")}
                ,where: { farmid:farmid,level:AlarmLevel,begin:AlarmBegin,end:AlarmEnd}
                ,page: {
                    limit:50,
                    limits:[10, 20, 30, 40, 50,100,200,300,400],
                    theme: '#3c7cff'
                }
                ,limit:20
                //,toolbar: '#table_toolbar' //开启头部工具栏，并为其绑定左侧模板
                ,defaultToolbar: ['']
                ,title: ''
                //,even:true
                //,size: 'sm' //小尺寸的表格
                //,skin: 'nob' //无框风格
                ,cols: [[
                    {field:'',title:'序号',type:'numbers'},
                    {field:'housename', title:'猪舍', width:200,  sort: true},
                    {field:'remark', title:'栏位',align:'center', width:110,  sort: true},
                    /*{field:'', title:'设备',align:'center', width:300,  sort: false,templet: function(d){
                        var html = "";
                        if(d.device_addr){
                            html += '<span class="">网关SN:'+d.device_addr+'</span>';
                        }
                        if(d.sn){
                            html += '&nbsp<span class="">饲喂器SN:'+d.sn+'</span>';
                        }
                        return html;
                    }},
                    */
                    /*{field:'', title:'类型', width:120, align:'center', sort: false,templet: function(d){
                            var html = "";
                            if(d.level==0){
                                html+="<span class='layui-text-orange'><i class='icon layui-icon layui-icon-chat '></i>通知</span> ";
                            }else{
                                if(d.status==0){
                                    html+="<span class='layui-text-mute'><i class=' icon layui-icon layui-icon-ok-circle '>告警取消</i></span> ";
                                }else{
                                    html+="<span class='layui-text-red'><i class=' layui-icon layui-icon-notice '>告警发生</i></span> ";
                                }
                            }
                            return html;
                        }},
                    */
                   {field:'', title:'类型', width:80, align:'center', sort: false,templet: function(d){
                        var html="";
                        if(d.type){
                            if(d.type=="1"){
                                html = "<span class='layui-badge-rim'>"+"智能网关"+"</span>";
                            }else if(d.type=="2"){
                                html = "<span class='layui-badge-rim'>"+"饲喂器"+"</span>";
                            }else if(d.type=="10"){
                                html = "<span class='layui-badge-rim'>"+"日采食"+"</span>";
                            }
                        }
                        return html;
                    }},
                    {field:'level', title:'级别', width:90,align:'center',hide:hide,  sort: true,templet: function(d){
                            var html = "";
                            if(d.level==0){
                                html="-";
                            }else{
                                if(d.status==0){
                                    html+="<span class='layui-text-mute'><i class='  '>"+d.level+"</i></span> ";
                                }else{
                                    html+="<span class='layui-text-red'><i class='  '>"+d.level+"</i></span> ";
                                }
                            }
                            return html;
                        }},
                    {field:'alarm_content', title:alarm_notice_title,  sort: true,templet: function(d){
                            var html = "";
                            if(d.status==0){
                                if(d.level>0){
                                    html+="<span class=\"layui-text-mute line-through\">"+d.alarm_content+"</span> ";
                                }else{
                                    html+="<span class=\"layui-text-mute line-through\">"+d.alarm_content+"</span> ";
                                }
                                
                            }else{
                                if(d.level>0){
                                    html+="<span class=\"layui-text-red\">"+d.alarm_content+"</span>";
                                }else{
                                    html+="<span class=\"layui-text-orange\">"+d.alarm_content+"</span> ";
                                }
                                
                            }
                            return html;
                        }},
                    //{field:'device_addr',align:'center', title:'网关SN', width:120,  sort: true,hide:hide},
                    //{field:'sn',align:'center', title:'饲喂器SN', width:120,  sort: true,hide:hide},
                    
                    
                    {field:'add_time', title:'发生时间', width:200, sort: true,templet: function(d){
                        var html = "";
                        html = moment(d.add_time).format("YYYY-MM-DD HH:mm:ss");
                        return html;
                    }},
                    {field:'cancel_time', title:'取消时间', width:200, sort: true,hide:hide_cancel_time ,templet: function(d){
                        var html = "";
                        html = moment(d.cancel_time).format("YYYY-MM-DD HH:mm:ss");
                        return html;
                    }},
                    {field:'duration', title:'持续时间',width:160, sort: true,hide:hide_dura_time, align:'center', templet: function(d) {
                        var new_timestamp = moment().unix();
                        var add_time_timestamp = moment(d.add_time).unix();
                        console.info(new_timestamp,add_time_timestamp);
                        var duration = new_timestamp - add_time_timestamp;
                        return beautyTimeSpan(duration);
                    }}
                ]]
                ,done: function(res, curr, count){
                    for(var i=0;i<actions.length;i++){
                        $('.action-'+actions[i].action_id).removeClass("layui-hide");
                    }
                    var that = this.elem.next();

                }
            });

            table.on('sort(alarm_table)', function(obj){
                table.reload('alarm_table', {
                    initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。
                    ,where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                        //order_field: obj.field //排序字段
                        //,order_type: obj.type //排序方式
                        order:obj.field+" "+(obj.type||"")
                    }
                });
            });

            //触发行双击事件
            table.on('rowDouble(alarm_table)', function(obj){
                console.info(obj.data);
                var permit = false;
                for(var i=0;i<actions.length;i++){
                    if(actions[i].action_id == "delete"){
                        permit = true;
                        break;
                    }
                }
                if(permit){
                    layer.confirm('确认消除 '+obj.data.housename+" "+obj.data.remark+" "+obj.data.alarm_content+" 告警?", function(index){
                        layer.close(index); //再执行关闭
                        layer.load(1);
                        $.ajax({
                            type: 'DELETE',
                            url: '../Api/Alarm',
                            data: {id:obj.data.id},
                            beforeSend: function(request) {
                                request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                            },
                            dataType: "json",
                            success: function (res) {
                                if(res.code>=0){
                                    loadAll(cur_farm_id);
                                }else{
                                    layer.alert(res.msg);
                                }
                            },
                            error: function (XMLHttpRequest, textStatus, errorThrown) {
                                layer.msg('加载信息失败');
                            },
                            complete: function(XMLHttpRequest, textStatus) {
                                layer.closeAll('loading');
                            },

                        });
                    });
                }
                
            });
        }
        
        function loadAlarmSumary(farmid){
            //alarm-badge
            $.ajax({
                type: 'GET',
                url: '../Api/Alarm/FarmSummary',
                data: {farmid:farmid},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        var obj=res.data;
                        vm_alarm.total_num = obj.total_num;
                        vm_alarm.alarm_num = obj.alarm_num;
                        vm_alarm.cancel_num = obj.cancel_num;
                        vm_alarm.notice_num = obj.notice_num;

                        if(obj.alarm_num>0){
                            $("#alarm-badge").html(obj.alarm_num);
                            $("#alarm-badge").show();
                        }else{
                            $("#alarm-badge").hide();
                        }
                    }else{
                        toastr.warning(res.msg, "异常");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });
        }

        function loadGw(farmid) {
            vm_gw.list= [];
            layer.load(1);
            $.ajax({
                type: 'GET',
                url: '../Api/Device',
                data: {farmid:farmid,alive:GwType},
                beforeSend: function(request) {
                    request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                },
                dataType: "json",
                success: function (res) {
                    if(res.code>=0){
                        var list = res.data;
                        if(list){
                            var online_num = 0;
                            var offline_num = 0;
                            for(var i=0;i<list.length;i++){
                                if(list[i].alive){
                                    online_num++;
                                }else{
                                    offline_num++;
                                }
                            }
                            vm_gw.online_num = online_num;
                            vm_gw.offline_num = offline_num;
                            vm_gw.list= list;
                        }

                    }else{
                        layer.alert(res.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('加载信息失败');
                },
                complete: function(XMLHttpRequest, textStatus) {
                    layer.closeAll('loading');
                },

            });
        }

        //日采食记录
        function getStatusHis(farmid,houseid,his_date){
            var promise = new Promise(function(resolve, reject) {
                $.ajax({
                    type: 'GET',
                    url: '../Api/History/StatusHis',
                    data: {farmid:farmid,houseid:houseid,his_date:his_date},
                    beforeSend: function(request) {
                        request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                    },
                    success: function (data) {

                        if (data && data.code>=0) {
                            resolve(data);
                        }else{
                            resolve(data);
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        reject(err);
                    },
                    complete: function(XMLHttpRequest, textStatus) {

                    },
                    dataType: "json"
                });
            });
            return promise;
        }

        //小时采食记录
        function getRecord(farmid,houseid,date){
            var begin=date;
            var end=moment(date).add(1,"days").format('YYYY-MM-DD');
            var obj={fields:"feed_type,amount,rectime",farmid:farmid,houseid:houseid,begin:begin,end:end,order:" rectime asc ",begin_end:0,tb_record:0};
            var promise = new Promise(function(resolve, reject) {
                $.ajax({
                    type: 'GET',
                    url: '../Api/History/FeedRecord',
                    data: obj,
                    beforeSend: function(request) {
                        request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                    },
                    success: function (data) {

                        if (data && data.code>=0) {
                            resolve(data);
                        }else{
                            resolve(data);
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        reject(err);
                    },
                    complete: function(XMLHttpRequest, textStatus) {

                    },
                    dataType: "json"
                });
            });
            return promise;
        }

        //获取养殖场下单元列表
        function getHouseList(farmid){
            var promise = new Promise(function(resolve, reject) {
                $.ajax({
                    type: 'GET',
                    url: '../Api/House',
                    data: {farmid:farmid},
                    beforeSend: function(request) {
                        request.setRequestHeader("Authorization", 'Bearer '+window.localStorage.getItem("token"));
                    },
                    success: function (data) {

                        if (data && data.code>=0) {
                            resolve(data);
                        }else{
                            resolve(data);
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        reject(err);
                    },
                    complete: function(XMLHttpRequest, textStatus) {

                    },
                    dataType: "json"
                });
            });
            return promise;
        }

        function gotoAlarm(){
            element.tabChange('main-tab', 'alarm'); 
        }
        function gotoGw(){
            element.tabChange('main-tab', 'gw'); 
        }
        function gotoHouse(item,idx){
            console.info(JSON.stringify(item));
            window.location.href="../House/Status?id="+item.houseid+"&farmid="+item.farmid;
        }

        function onExportDayAvgFeed(){
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            console.info(cur_farm_id)
            console.info(vm_farm.farmname)
            console.info(JSON.stringify(vm_house.list))
            var begin = moment().add(-1, 'months').format('YYYY-MM-DD');
            var end = moment().add(-1, 'days').format('YYYY-MM-DD'); 
            var obj={
                id:cur_houseid,
                name:vm_farm.farmname +" "+ cur_housename+" 单元头均采食量",
                daterange:begin+" ~ "+end,
                url:'../Api/House/DayAvgFeed/Export',
            };
            console.info(obj)

            laydate.render({
                elem: '#daterange'
                //,type: 'datetime'
                ,range: '~'
                , theme: '#3c7cff'
                ,value: begin+" ~ "+end
                ,isInitValue: true
                ,done: function(value, date, endDate){
                    //setTimeout(function(){load();},200);
                }
            });

            form.val("form",obj);
            layer.open({
                //area: 'auto',
                area:['350px','300px'],
                type: 1,
                offset: '20%',
                shade: 0.3,
                shadeClose:true,
                title: '导出 单元头均采食量', //不显示标题
                content: $('#form'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
                btn: ['确定', '取消']
                ,yes: function(index, layero){
                    lay_index=index;
                    var submit = layero.find("#btn_export");
                    submit.click();
                }
            });
        }

        function onExportDaySumFeed(){
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            console.info(cur_farm_id)
            console.info(vm_farm.farmname)
            var begin = moment().add(-1, 'months').format('YYYY-MM-DD');
            var end = moment().add(-1, 'days').format('YYYY-MM-DD'); 
            var obj={
                farmid:cur_farm_id,
                farmname:vm_farm.farmname,
                daterange:begin+" ~ "+end,
                name:'日总采食',
                url:'../Api/Farm/DaySumFeed/Export',
            };
            console.info(obj)

            laydate.render({
                elem: '#daterange'
                //,type: 'datetime'
                ,range: '~'
                , theme: '#3c7cff'
                ,value: begin+" ~ "+end
                ,isInitValue: true
                ,done: function(value, date, endDate){
                    //setTimeout(function(){load();},200);
                }
            });

            form.val("form",obj);
            layer.open({
                //area: 'auto',
                area:['350px','300px'],
                type: 1,
                offset: '20%',
                shade: 0.3,
                shadeClose:true,
                title: '导出 日总采食', //不显示标题
                content: $('#form'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
                btn: ['确定', '取消']
                ,yes: function(index, layero){
                    lay_index=index;
                    var submit = layero.find("#btn_export");
                    submit.click();
                }
            });
        }

        function onExportHouseSort(){
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            console.info(cur_farm_id)
            console.info(vm_farm.farmname)
            var begin = moment().add(-1, 'months').format('YYYY-MM-DD');
            var end = moment().add(-1, 'days').format('YYYY-MM-DD'); 
            var obj={
                id:cur_farm_id,
                name:vm_farm.farmname,
                daterange:begin+" ~ "+end,
                url:'../Api/Farm/HouseSummarySort/Export',
            };
            console.info(obj)

            laydate.render({
                elem: '#daterange'
                //,type: 'datetime'
                ,range: '~'
                , theme: '#3c7cff'
                ,value: begin+" ~ "+end
                ,isInitValue: true
                ,done: function(value, date, endDate){
                    //setTimeout(function(){load();},200);
                }
            });

            form.val("form",obj);
            layer.open({
                //area: 'auto',
                area:['350px','300px'],
                type: 1,
                offset: '20%',
                shade: 0.3,
                shadeClose:true,
                title: '导出 单元饲喂概况', //不显示标题
                content: $('#form'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
                btn: ['确定', '取消']
                ,yes: function(index, layero){
                    lay_index=index;
                    var submit = layero.find("#btn_export");
                    submit.click();
                }
            });
        }

        function renderFarmSelect() {
            //栏舍下拉
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            var html = "";
            for (var i = 0; i < farms.length; i++) {
                var selectd = "";
                if (farms[i].id == cur_farm_id) {
                    selectd = " selected ";
                }
                html += "<option " + selectd + " value=\"" + farms[i].id + "\">" + farms[i].farmname + "</option>";
            }

            $("select[name='farm']").html(html);
            form.render('select');
        }

        function renderHouseSelect(houses) {
            //栏舍下拉
            var html = "";
            for (var i = 0; i < houses.length; i++) {
                var selectd = "";
                if (i==0) {
                    selectd = " selected ";
                    cur_houseid = houses[0].id;
                    cur_housename = houses[0].housename;
                }
                html += "<option " + selectd + " value=\"" + houses[i].id + "\">" + houses[i].housename + "</option>";
            }

            $("select[name='house']").html(html);
            form.render('select');
        }

        function initCharts() {
            chartDayAvgFeed = echarts.init(document.getElementById('chartDayAvgFeed'));
            chartDayAvgFeed.on('click', function (params) {
                console.info(params);
                onShowHouseHourFeed(params);
            })
            chartDaySumFeed = echarts.init(document.getElementById('chartDaySumFeed'));
            chartDaySumFeed.on('click', function (params) {
                console.info(params);
                //onShowFarmHourFeed(params);
            })
            chartHouseSort = echarts.init(document.getElementById('chartHouseSort'));
            chartAchievementRate = echarts.init(document.getElementById('chartAchievementRate'));
            chartAchievementRate.on('click', function (params) {
                onShowHisAchievement(params)
            })
        }

        function onShowHisAchievement(params){
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            var date = $("#id-date1").html();
            console.info(params);
            console.info(params.dataIndex,params.name);
            layer.open({
                    //area: 'auto',
                    area:['700px','500px'],
                    offset: '10%',
                    shade: 0.5,
                    shadeClose: true,
                    type: 1,
                    title: date+" "+params.name+" 详细信息", //不显示标题
                    content: $('#form_his'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
                    btn: ['确定'],
                    maxmin: false,
                    yes: function(index, layero){
                        layer.close(index);
                    }
            });

            var obj={};
            obj.farmid = cur_farm_id;
            obj.his_date = date;
            if(params.dataIndex==0){
                //正常
                obj.health = "good";
            }else if(params.dataIndex==1){
                //高
                obj.health = "high";
            }else if(params.dataIndex==2){
                //低
                obj.health = "low";
            }
            obj.mode = "1,2,3,4";

            table.render({
                elem: '#table_his'
                ,url: "../Api/History/FeedHis/Page"
                ,height: '350'
                ,method:'GET'
                ,headers : {'Authorization': 'Bearer '+window.localStorage.getItem("token")}
                ,where: obj
                ,page: false
                ,limit:999999
                ,title: ''
                ,even:true
                ,size: 'sm' //小尺寸的表格
                //,skin: 'nob' //无框风格
                ,cols: [[
                    {field:'housename', title:'栏舍单元',minWidth:120, sort: true}
                    ,{field:'hnum', title:'栏位',width:80, sort: true}
                    ,{field:'mode', title:'猪只状态',width:110,align:'center', sort: false, templet: function(d) {
                            var modestr = "";
                            if(d.device_type){
                                if(d.device_type=="HZFGW"){
                                        modestr = decodeMode(d.mode);
                                    }else if(d.device_type=="DMXFGW"){
                                        modestr = decodeModeNew(d.mode);
                                    }else{
                                        modestr="未知";
                                    }
                            }else{
                                modestr="未知";
                            }
                            
                            if(d.mode==0){
                                return "<span class='layui-text-orange'>"+modestr+"</span>";
                            }else{
                                return "<span class=''>"+modestr+"</span> "+"<span class=''>"+d.day+"天</span>";
                            }
                        }}
                    ,{field:'his_date', title:'采食日期',width:110,align:'center', sort: true, templet: function(d) {
                        return moment(d.his_date).format("YYYY-MM-DD");
                    }}
                    ,{field:'avg_feed', title:'头均采食(kg)',width:110, sort: true, templet: function(d) {
                            var html="";
                            if(d.avg_feed){
                                html = parseFloat((d.avg_feed).toFixed(2)).toString();
                            }else{
                                html = "-";
                            }
                            return  html;
                        }}
                    ,{field:'', title:'采食状况',width:100,align:'center', sort: false, templet: function(d) {
                            var html = "";
                            if(d.mode>0){
                                if(d.health){
                                    if(d.health=="low"){
                                        html+= "<span class='layui-text-orange'>↓采食量低</span>";
                                    }else if(d.health=="good"){
                                        html+= "<span class='layui-text-green-light'>采食量达标</span>";
                                    }else if(d.health=="high"){
                                        html+= "<span class='layui-text-orange-light'>↑采食量高</span>";
                                    }
                                }
                            }else{
                                html="-";
                            }
                            
                            return html;
                        }}
                    ]]
                ,done: function(res, curr, count){
                    
                }
            });
        }

        //单元小时采食
        function onShowHouseHourFeed(params){
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            console.info(params);
            console.info(params.dataIndex,params.name);
            var item = houseDayFeed[params.dataIndex];
            console.info(item);
            var pig_num = item.pig_num;
            var date = moment(item.his_date).format("YYYY-MM-DD");
            layer.open({
                    //area: 'auto',
                    area:['700px','500px'],
                    offset: '10%',
                    shade: 0.5,
                    shadeClose: true,
                    type: 1,
                    title: '<i class="layui-icon layui-icon-chart"></i> '+cur_housename+" "+date+" 小时采食", //不显示
                    content: $('#form_feed_chart'),
            });

            if(!hour_his_chart){
                hour_his_chart = echarts.init(document.getElementById('hour_his_chart'));
            }
            hour_his_chart.showLoading({maskColor: maskColor,textColor: '#3c7cff',text: 'loading',});
            getRecord(cur_farm_id,cur_houseid,date).then(function(res){
                hour_his_chart.hideLoading();
                if(res && res.code>=0){
                    console.info(res.data);

                    //var today = moment().format('YYYY-MM-DD'); 

                    var hour_arr =[];
                    var hour_desc_arr =[];
                    var feed_arr =[];
                    var water_arr =[];
                    var avg_feed_arr =[];
                    for(var i=0;i<24;i++){
                        var hour = i;
                        hour_arr.push(hour);
                        var start = moment(date).add(hour,"hours").format('HH:00');
                        var finish = moment(date).add(hour+1,"hours").format('HH:00');
                        hour_desc_arr.push(start+"-"+finish);

                        var sum_feed = 0;
                        var sum_water = 0;
                        var avg_feed = 0;
                        for(var x=0;x<res.data.length;x++){
                            var his = res.data[x];
                            var feed_type = his.feed_type;
                            var amount = parseFloat(his.amount);
                            var rectime = his.rectime;
                            if(moment(rectime).hour()==hour){
                                if(feed_type>0)
                                {
                                    //料
                                    sum_feed+=amount;
                                }
                                else
                                {
                                    sum_water+=amount;
                                }
                            }
                        }

                        

                        feed_arr.push(sum_feed.toFixed(2));
                        water_arr.push(sum_water.toFixed(2));
                        if(pig_num>0)
                        {
                            avg_feed_arr.push((sum_feed/pig_num).toFixed(2));
                        }
                        else
                        {
                            avg_feed_arr.push(0);
                        }
                    }

                    console.info("feed_arr",feed_arr);
                    console.info("water_arr",water_arr);
                    console.info("hour_arr",hour_arr);
                    console.info("hour_desc_arr",hour_desc_arr);


                    hour_his_chart_options.series[0].data= feed_arr;
                    hour_his_chart_options.series[1].data= water_arr;
                    hour_his_chart_options.series[2].data= avg_feed_arr;

                    hour_his_chart_options.xAxis[0].data = hour_desc_arr;
                    

                    setTimeout(function(){
                        hour_his_chart.setOption(hour_his_chart_options);
                        hour_his_chart.resize();
                    },200);
                }
            })
        }

        //场区小时采食
        function onShowFarmHourFeed(params){
            var cur_farm_id = window.localStorage.getItem("cur_farm_id");
            console.info(params);
            console.info(params.dataIndex,params.name);
            var item = farmDayFeed[params.dataIndex];
            console.info(item);
            var pig_num = item.pig_num;
            var date = moment(item.his_date).format("YYYY-MM-DD");
            layer.open({
                    //area: 'auto',
                    area:['700px','500px'],
                    offset: '10%',
                    shade: 0.5,
                    shadeClose: true,
                    type: 1,
                    title: '<i class="layui-icon layui-icon-chart"></i> '+cur_farm.farmname+" "+date+" 小时采食", //不显示
                    content: $('#form_feed_chart'),
            });

            if(!hour_his_chart){
                hour_his_chart = echarts.init(document.getElementById('hour_his_chart'));
            }
            hour_his_chart.showLoading({maskColor: maskColor,textColor: '#3c7cff',text: 'loading',});
            getRecord(cur_farm_id,"",date).then(function(res){
                hour_his_chart.hideLoading();
                if(res && res.code>=0){
                    console.info(res.data);

                    //var today = moment().format('YYYY-MM-DD'); 

                    var hour_arr =[];
                    var hour_desc_arr =[];
                    var feed_arr =[];
                    var water_arr =[];
                    var avg_feed_arr =[];
                    for(var i=0;i<24;i++){
                        var hour = i;
                        hour_arr.push(hour);
                        var start = moment(date).add(hour,"hours").format('HH:00');
                        var finish = moment(date).add(hour+1,"hours").format('HH:00');
                        hour_desc_arr.push(start+"-"+finish);

                        var sum_feed = 0;
                        var sum_water = 0;
                        var avg_feed = 0;
                        for(var x=0;x<res.data.length;x++){
                            var his = res.data[x];
                            var feed_type = his.feed_type;
                            var amount = parseFloat(his.amount);
                            var rectime = his.rectime;
                            if(moment(rectime).hour()==hour){
                                if(feed_type>0)
                                {
                                    //料
                                    sum_feed+=amount;
                                }
                                else
                                {
                                    sum_water+=amount;
                                }
                            }
                        }

                        

                        feed_arr.push(sum_feed.toFixed(2));
                        water_arr.push(sum_water.toFixed(2));
                        if(pig_num>0)
                        {
                            avg_feed_arr.push((sum_feed/pig_num).toFixed(2));
                        }
                        else
                        {
                            avg_feed_arr.push(0);
                        }
                    }

                    console.info("feed_arr",feed_arr);
                    console.info("water_arr",water_arr);
                    console.info("hour_arr",hour_arr);
                    console.info("hour_desc_arr",hour_desc_arr);


                    hour_his_chart_options.series[0].data= feed_arr;
                    hour_his_chart_options.series[1].data= water_arr;
                    hour_his_chart_options.series[2].data= avg_feed_arr;

                    hour_his_chart_options.xAxis[0].data = hour_desc_arr;
                    

                    setTimeout(function(){
                        hour_his_chart.setOption(hour_his_chart_options);
                        hour_his_chart.resize();
                    },200);
                }
            })
        }

        window.onresize = function () {
            resize();
        };
        function resize() {
            //字体变化
            const width = document.body.clientWidth;
            const ratio = width / 1920;
            const val = Math.round(16 * ratio);//浏览器默认16px;
            document.documentElement.style.fontSize = val + 'px';

            var h = $(".content").height();
            $(".content-div").height(h - 60);
            // $(".content-div").slimScroll({
            //     height: h-60,
            //     size: '5px', //组件宽度
            //     color: '#eee', //滚动条颜色
            //     position: 'right', //组件位置：left/right
            //     distance: '0px', //组件与侧边之间的距离
            //     start: 'top', //默认滚动位置：top/bottom
            //     opacity: .4, //滚动条透明度
            //     alwaysVisible: true, //是否 始终显示组件
            //     disableFadeOut: false, //是否 鼠标经过可滚动区域时显示组件，离开时隐藏组件
            //     railVisible: true, //是否 显示轨道
            //     railColor: '#333', //轨道颜色
            //     railOpacity: .2, //轨道透明度
            //     railDraggable: true, //是否 滚动条可拖动
            //     railClass: 'slimScrollRail', //轨道div类名
            //     barClass: 'slimScrollBar', //滚动条div类名
            //     wrapperClass: 'slimScrollDiv', //外包div类名
            //     allowPageScroll: true, //是否 使用滚轮到达顶端/底端时，滚动窗口
            //     wheelStep: 20, //滚轮滚动量
            //     touchScrollStep: 200, //滚动量当用户使用手势
            //     borderRadius: '7px', //滚动条圆角
            //     railBorderRadius: '7px' //轨道圆角
            // });


            if (chartDaySumFeed) {
                chartDaySumFeed.resize();
            }
            if (chartDayAvgFeed) {
                chartDayAvgFeed.resize();
            }
            if (chartAchievementRate) {
                chartAchievementRate.resize();
            }
            if (chartHouseSort) {
                chartHouseSort.resize();
            }
        }

        // 根据不同的屏幕宽度换算字体大小
        function transformFontSize(fontsize) {
            // 获取屏幕宽度
            //const width = window.screen.width
            const width = document.body.clientWidth;
            //const ratio = width / 1920
            const ratio = width / 1920
            console.info(width, ratio);
            // 取下整
            return Math.round(fontsize * ratio)
        }
        function encodeUrl(obj) {
            var str = [];
            for (var p in obj)
                if (obj.hasOwnProperty(p)) {
                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
                }
            return str.join("&");
        }
        function beautyTimeSpan(seconds){
            var str ="";
            var day_val=parseInt(seconds/(60*60*24)) ;
            var rest=seconds % (60*60*24);
            var hour_val= parseInt(rest/(60*60));
            rest=seconds % (60*60);
            var minite_val= parseInt(rest/(60));
            rest=seconds % (60);

            if(day_val>0){
                str+=(day_val + "天")
            }
            if(hour_val>0){
                str+=(hour_val + "时")
            }
            if(minite_val>0){
                str+=(minite_val + "分")
            }
            if(rest>0){
                str+=(rest + "秒")
            }

            return str
        }
    </script>

    <script src="../js/check_screen.js?v=${.Config.basic.version}"></script>


</body>

<form class="layui-form" lay-filter="form" id="form" style="padding: 20px 30px 0 0;display:none;">
    <div class="layui-form-item layui-hide">
        <label class="layui-form-label"></label>
        <div class="layui-input-block">
            <input type="text" name="farmid" lay-verify="" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <label class="layui-form-label"></label>
        <div class="layui-input-block">
            <input type="text" name="houseid" lay-verify="" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <label class="layui-form-label"></label>
        <div class="layui-input-block">
            <input type="text" name="id" lay-verify="" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <label class="layui-form-label"></label>
        <div class="layui-input-block">
            <input type="text" name="url" lay-verify="required" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">区域</label>
        <div class="layui-input-block">
            <input type="text" name="name" readonly lay-verify="required" lay-verType="tips" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">日期 <span class="layui-text-red">*</span></label>
        <div class="layui-input-block">
            <input type="text" id="daterange" name="daterange" lay-verify="required" lay-verType="tips" placeholder="" autocomplete="off" class="layui-input" style="width: 100%">
        </div>
    </div>

    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="btn_export" id="btn_export" value="确认">
    </div>

</form>




<form class="layui-form" lay-filter="form_his" id="form_his" style="padding: 10px;display:none;">
    <table class="layui-hide" id="table_his" lay-filter="table_his"></table>
</form>

<form class="layui-form" lay-filter="form_feed_chart" id="form_feed_chart" style="padding: 2%;height: 90%;display:none;">
    <div class="center-block" style="height: 100%;">
        <div id="hour_his_chart" style="height: 100%"></div>
    </div>
</form>
</html>